今日vue2.x组件的动态prop学习总结

我们可以用v-bind动态的把prop动态地绑定到父组件上,每当父组件的数据变化时,该变化也会传递给子组件:

js编写,可以在外面注册child组件,也可以用compontents定义一个组件

以下实例中将 v-bind 指令将 todo 传到每一个重复的组件中:

父组件是使用props传递数据给子组件,但如果有子组件要把数据传递回去,就需要使用自定义事件,我们可以使用v-on绑定自定义事件,每个vue实例都实现了事件接口,即:

1、使用$on(eventName)监听事件。2、使用$emit(eventName)触发事件

另外,父组件可以在使用子组件的地方直接用v-on来监听子组件触发的事件。以下实例中子组件已经和它外部完全解耦了。它所做的只是触发一个父组件关心的内部事件。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 下载安装搭建环境 可以选npm安装,或者简单下载一个开发版的vue.js文件 浏览器打开加载有vue的文档时,控制...
    冥冥2017阅读 6,123评论 0 42
  • Vue 实例 属性和方法 每个 Vue 实例都会代理其 data 对象里所有的属性:var data = { a:...
    云之外阅读 2,273评论 0 6
  • 1.安装 可以简单地在页面引入Vue.js作为独立版本,Vue即被注册为全局变量,可以在页面使用了。 如果希望搭建...
    Awey阅读 11,157评论 4 129
  • 这篇笔记主要包含 Vue 2 不同于 Vue 1 或者特有的内容,还有我对于 Vue 1.0 印象不深的内容。关于...
    云之外阅读 5,095评论 0 29
  • 此文基于官方文档,里面部分例子有改动,加上了一些自己的理解 什么是组件? 组件(Component)是 Vue.j...
    陆志均阅读 3,883评论 5 14