初识Vue 3.0 —— data:获取到data的值
七娃博客743人阅读
<h5>13.data</h5> <p>组件的 data 选项是一个函数。Vue 在创建新组件实例的过程中调用此函数。它应该返回一个对象,然后 Vue 会通过响应性系统将其包裹起来,并以 $data 的形式存储在组件实例中。</p> <div id="dd"> <span style="margin-right: 15px;">data的num的值:{{num}}</span> <button @click="add">加1</button> </div> <pre>通过vm = dd.mount('#dd')将声明实例,vm.$data.num和vm.num的方法都可以获取到data的值,也可以改变data的值(F12查看打印值)</pre> <script type="text/javascript"> //data 实例 const dd = Vue.createApp({ data(){ return{ num:0 } }, methods:{ add(){ this.num++; } } }) const vm = dd.mount('#dd'); vm.num = 100; console.log('vm.$data.num:'+vm.$data.num); console.log('vm.num:'+vm.num); </script>
评论 | 0 条评论
登录之后才可留言,前往登录