关于vue的那些小事

1. 在子组件中触发父组件中的方法

<arrowtitle @myevent='myevent'>
</arrowtitle>
import arrowtitle from './arrowtitle'
methods: {
myevent () {
console.log('myevent')
}
}

<template>
<div @click='linkEvent'>测试</div>
</template>
methods: {
linkEvent () {
this.$emit('myevent')
}
}

2. 动态在父组件中添加子组件

<template>
<div>
<p @click='handleClick'>显示子组件：</p>
<component :is="vuename"></component>
</div>
</template>
<script>
const Foo = resolve => require(['./applyManage.vue'], resolve)
export default{
data () {
return {
vuename: ''
}
},
methods:{
handleClick () {
this.vuename = Foo
}
}
}
</script>
当点击p标签时，子组件才会渲染进去

3. 在父组件中触发子组件中的方法

<div click='parentClick'>
<child ref='profile'></child>
</div>
在父组件中：
methods: {
parentClick () {
this.$refs.profile.childClick('2017-08')
}
}
在子组件中：
methods: {
childClick (date) {
console.log(date)
}
}