Vue表单类的父子组件数据传递示例
使用Vue.js进行项目开发,那必然会使用基于组件的开发方式,这种方式的确给开发和维护带来的一定的便利性,但如果涉及到组件之间的数据与状态传递交互,就是一件麻烦事了,特别是面对有一大堆表单的页面。
在这里记录一下我平时常用的处理方式,这篇文章主要记录父子组件间的数据传递,非父子组件主要通过Vuex处理,这篇文章暂时不作说明。
与文档里给的方案一样,父组件向子组件传递数据主要通过props,子组件向父组件传递数据主要通过触发器$emit(),只是在用法上会有些不同。
1、传递基本类型数据
当子组件内容较少时,会直接传递基本类型数据,通常为String,Number,Boolean三种。
先看个例子:
问卷调查
姓名:{{form.name}}