Vue.js中使用props传值的方法
发布于 2020-8-17|
复制链接
摘记: 1.静态传值(在父组件中赋值好props中属性的值传递给子组件)父组件
```javascript
```
子组件
```javascript
{{message}}
..
1.静态传值(在父组件中赋值好props中属性的值传递给子组件)父组件
```javascript
import child from './components/child.vue'
export default{
components:{
child
}
}
```
子组件
```javascript
{{message}}
export default{
props:['message'],
data(){
},
methods:{
fun:function(){
}
}
}
```
结果:打印hello
2.动态传递(根据父组件中值的改变,props动态的改变子组件中的值)父组件
```javascript
import child from "./components/child.vue"
export default{
//构建child组件
components:{
child
},
data(){
return {
//初始化message
message:''
}
}
}
```
2.子组件
```javascript
childmessage is:{{childmessage}}
export default{
//将childmessage传递给child
props:['childmessage']
}
```