Examples Vue itself is a component, and component is the root
Parent component subassembly to pass values
1. The value of the internal component is passed over the reception by props
Vue.component('menu-item',{
props:['title'],
template:'<div>{{title}}</div>'
})2. The parent component subassembly to pass through the value attribute
<menu-item title="来自父组件的数据"</menu-item>
<menu-item :title="title"></menu-item>3.props property name Rules
- Use hump in the form of props, the need to use the template form of dashes
- String template does not have this restriction
Vue.component(`menu-item`,{
//在JavaScript中是驼峰式的
props:['menuTitle'],
template:'<div>{{menuTitle}}</div>'
})
<!--在html中是短横线方式的-->
<menu-item menu-title="nihao"></menu-item>
4.props Property Value Type
- String String
- Value Number
- Boolean values Boolean
- Array Array
- Object Object
The first three are the basic data types, the latter two types is a reference
note: Boolean and numeric data types, if bound, then by a v-bind, in the subassembly can be obtained corresponding to the type of data,
if not v-bind do bindings, data obtained are strings in the form of content.