当前位置:

Vue 学习总结1

本文最后更新于2022-01-27,已超过 1年没有更新,如果文章内容、图片或者下载资源失效,请留言反馈,我会及时处理,谢谢!

温馨提示:本文共829个字,读完预计3分钟。

<!–总结–>
1、 v-on: => @
2、 v-bind:content => :content
3、 v-model 数据双向绑定
4、 全局组件 Vue.components("组件名(驼峰命名)", {})创建
5、 局部组件 var TodoItem = {}, 需要在父组件中用
components: {
TodoItem: TodoItem
}注册, 只有注册后才有效
6、 mvc模式主要在c, 面向dom, 主要是dom操作
7、 mvvm面向数据

8.父子组件传值
父–>子 通过v-bind:变量名来实现传值,子组件通过props属性接收父组件传的值
子–>父 通过this.$emit("事件名", "参数")向上一层触发事件,父组件通过@事件名来监听事件并接收子页面传递的参数

​9.splice():从数组中添加或者删除项目,然后返回被删除的项目

 

附录:

Vue内部提供全局组件方法:

<todo-item v-for="item in list"></todo-item>
Vue.component("命名", {
    template: "<li>todo Item</li>"
})

向子组件传递绑定内容:v-bind: content="item"

循环list时,将list每个值赋值给item

<todo-item v-for="item in list"></todo-item>

将item值通过v-bind传给<todo-item>,通过content变量传递

<todo-item v-bind="content"></todo-item>

子组件从父组件接收内容:props: [‘content’]

局部组件:

定义对象TodoItem:

var TodoItem = {
    props: [‘content’],
    template: "<li>{{content}}</li>"
}

将TodoItem组件注册到根Vue实例中:

components: {
    TodoItem: TodoItem
}

本文链接:,转发请注明来源!
评论已关闭。