的经典例子
同样,我会一步一步从原生js,jQuery在到vuejs,并且实现父子元素的通信,实现效果如下图所示:
输入框内输入值,点击添加按钮,将表单中的值添加到页面中,同时,又可以删除列表项内容,注意是删除列表项而不是隐藏...,一般都是后台返回的字段中,写入一个唯一的标识符,例如:id,关于key详细内容,可以移步官方文档阅读
可以循环渲染数组,对象,数字,字符串,上面的示例代码中in或者of 前面的item代表的是数组每一项值...,将数据渲染到页面中去的
首先要理解父组件和子组件,他们是一个相对的概念
在上述示例代码中,根组件(app)模板内的代码都属于父组件,而通过Vue.compont()或者局部注册的组件都是子组件
所谓的父组件向子组件传值...,这个item是父组件中list数组中的列表项,它是把list中的每一项值赋值给item,然后通过这个item,通过v-bind的方式传给这个todo-list组件,通过content这个变量来传的....deleteitem
注意:如果你直接将this.list = []的话,那么点击一项时,整个都会删除,明显不符合需求,所以同样需要有个索引值,那么同样,父组件传递给子组件一个索引值就可以了的,通过props