title: Property 'myfunc' was accessed during render but is not defined on instance
body: <p>I don't know why but this error <strong>Property 'myfunc' was accessed during render but is not defined on instance</strong> is keeps on showing.
  I am sharing my Html and js code.</p>
  <pre><code>const ListRenderingApp = {
    data() {
      return {
        todos: [
          { text: 'Learn JavaScript' },
          { text: 'Learn Vue' },
          { text: 'Build something awesome' }
        ]
      }
    },
    method : {
      myfunc(){
        console.log('drats')
      }
    }
  }
  Vue.createApp(ListRenderingApp).mount('#list-rendering')
  </code></pre>
  <p>And the Html files code is</p>
  <pre><code>&lt;div id=&quot;list-rendering&quot; class=&quot;demo&quot;&gt;
    &lt;ol&gt;
      &lt;li v-for=&quot;todo in todos&quot;&gt;
        {{ todo.text }}
      &lt;/li&gt;
      
    &lt;/ol&gt;
    &lt;button v-on:click=&quot;myfunc&quot;&gt; Click me&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  <p>I am very new to Vue.js. So, if anyone can please help me with this question.</p>