vue 参数父传子 Props 实例

1，子组件

<template>
<h1>props传递参数</h1>
<p>{{title}}</p>

<ul>
<li v-for="item in nelist">{{item}}</li>
</ul>

</template>

<script>
export default{
name:"mycomponent",
props:{
title:{
type:String,
default:""
},
nelist:{
type:Array,
default:""
}
}
}
</script>

<style scoped>

h1{
color:red;
}

</style>

2，父组件

<template>
<MyComponent :title="title" :nelist="nelist"/>
</template>

<script>
import MyComponent from "./components/MyComponent.vue"
export default{
name:"app vue",
data(){
return{
title:"我是参数",
nelist:[1,2,3]
}
},
components:{
MyComponent
}
}
</script>

文章来自 96net.com.cn