methods:{
sendData(){
this.$emit('confirm',this.childMessage)
}
}
}
App.vue
在父组件调用子组件的地方绑定一个@confirm
这个confirm哪来的呢?就是子组件在emit中定义好的
this.$emit('confirm',this.childMessage)
- 第一个入参是事件名,第二个是具体的值
父组件中不需要在接收的时候定义任何形参,默认的第一个形参就是子组件过来的值
confirm(val){
alert(val)
}
这样就实现了子组件中按钮点击触发事件,把子组件中的任意参数带过来。
vue中使用ref可以取到子组件中的变量或方法
怎么使用呢?
只需要在子组件标签定义
使用的时候
this.$refs.childRef.childFunc()
this.$refs.childRef.childMessage
这里this.$refs.childRef就表示了子组件这个对象了,可以分别取其中的值的方法
App.vue
Child.vue
我们在Demo1组件即将跳转到另一个组件的时候往this.$router里面装一个参数进去
this.$router.param = param
在Demo2组件create的时候打印一下这个
console.log(this.$router.param);
就可以看到Demo1带过来的参数了
Demo1.vue
Demo2.vue
getter.js
先定义好使用的vuex变量
const getters = {
msg: (state) => state.info.msg,
}
export default getters
info.js
const state = {
msg:null,
}
const mutations = {
setMsg(state, payload) {
state.msg = payload
console.log(444,state.msg);
},
}
export default {
namespaced: true,
state,
mutations,
}
全局注册vuex
import Vue from 'vue'
import Vuex from 'vuex'
import info from './modules/info'
import getters from './getters'
基础面试题
主要内容包括:HTML,CSS,JavaScript,浏览器,性能优化等等