vue笔记 父子组件传值1

另外在index.js 中需要绑定一下这个组件

import Vue from "vue";
import home from "./../components/home.vue";

let param={
    el: '.app2',
    components:{"homepage":home}
}
new Vue(param);

html 界面需要加入

解释部分
1.1 ref 可以再下个界面中取到这个组件 当做别名理解
1.2 v-model="username" 双向绑定,下个界面可以获取到 username ,也可以通过username给 这个组件赋值
1.3 :placeholder="morenwenzi" 省略写法 v-bind :placeholder="morenwenzi" 结合下方 props:['morenwenzi'], 用于赋值

2.1 components 绑定控件
2.2 ref="uname" 结合1.1 中的代码使用,用于获取控件
2.3 morenwenzi="请输入用户名" 结合1.3 中 用于输入一行文字
2.4 @import "./../css/bootstrap.css"; 引入 css

3.1 v-on:click="test()" 绑定一个事件
3.2 methods:{} 事件
3.3 alert(this.$parent.$refs.uname.$data.username);
首先获取这个控件的父控件 this.$parent
获取别名 $refs.uname
获取到这个控件的data $data
获取到data 中 的username