methods: {vue
add: function() {ui
this.$emit("showpro", this.list+'我是孩子的值'); // showpro是传往父组件的方法,后面参数是要传过去的参数this
}字符串
}it
父组件中io
import HelloWorldVue from "./HelloWorld.vue";console
<abc @showpro="met" ></abc> // 引用子组建传来的方法 showpro,这个方法即本组件中的met放法,注意这里不要写参数function
methods: {import
met(data2) { // 在这里能够直接的打印参数require
console.log("data2",data2);
}
}
import HelloWorldVue from "./HelloWorld.vue";
父组件中引用子组件,在这里子组件是<abc>
<template>
<abc v-bind:sunny="title2"></abc>传到子组件中取名为sunny,而引用的值是这个组件中的title2
<template>
export default {
name: "second",
data() {
return {
title2:"我是父组件的值:富士山下" // 这是字符串类型
};},}
在子组件中:
<template>
<p>{{sunny}}</p>
</div>
</template>
export default {
name: "compon",
props:{ // props接受父组件传来的值
sunny:{
type:String, // 传值的类型
required:true // 固定写法
}}}