vue-----vue3

本文主要是介绍vue-----vue3，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

1.vue 修饰符sync的功能是：当一个子组件改变了一个 prop 的值时，这个变化也会同步到父组件中所绑定。

2.在定义 methods 时应避免使用箭头函数，因为这会阻止 Vue 绑定恰当的 this 指向。

3.将同一函数定义为一个方法或者一个计算属性，最终结果确实是完全相同的。

computed 计算属性是基于它们的反应依赖关系缓存的,只在相关响应式依赖发生改变时它们才会重新求值

每当触发重新渲染时，调用方法将总会再次执行函数。

当需要在数据变化时执行异步或开销较大的操作时，watch这个方式是最有用的。

使用 watch 选项允许我们执行异步操作 (访问一个 API)，限制我们执行该操作的频率，并在我们得到最终结果前，设置中间状态。这些都是计算属性无法做到的。（watch里面可以调用方法）

总结：当监听data里面的数据需要做出操作用watch，当监听依赖于data的数据做出操作用computed

4.绑定css（可以是data里的数据对象；绑定一个返回对象的计算属性；数组格式；还有基础格式）   

:style  用法也一样，单独一点：可以多重赋值

<div :style="{ display: ['-webkit-box', '-ms-flexbox', 'flex'] }"></div>

对象格式：

计算属性格式：

 5.组件上使用css

 6.v-if v-for

当它们处于同一节点，v-if 的优先级比 v-for 更高，这意味着 v-if 将没有权限访问 v-for 里的变量：

 组件上可以使用v-for ,但是任何数据都不会被自动传递到组件里，因为组件有自己独立的作用域。为了把迭代数据传递到组件里，我们要使用 props：

<my-component v-for="item in items" :key="item.id"></my-component>

<my-component v-for="(item,index) in items" :key="item.id" :index="index" :item="item"></my-component>

 7.事件处理：事件处理程序中可以有多个方法，这些方法由逗号运算符分隔：

<button @click="one($event), two($event)">
  Submit
</button>

 8.

这篇关于vue-----vue3的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！