Vue 组件的挂载与父子组件的传值实例

1：将需要挂载的组件放置在component之中

2：全局挂载在main.js之中

import Vue from 'vue'
import App from './App.vue'
import getTime from './component/child/getTime'

//全局注册 整个项目的组件都可以使用
//注册给整个vue 对象
//引入需要注册的全局组件

//在vue类的方法 component里面进行注册
Vue.component('v-times',getTime);
Vue.component('v-times',{
 template:"
{{msg}}
",//字符串的标签模板
 data(){ //当前模板的数据
  return {
   msg:"时间"
  }
 }
});
new Vue({
 el: '#app',
 render: h => h(App)
})

3：局部挂载至当前父组件之内

4：父组件传值给子组件

父组件：

子组件：

5：子组件调用父组件的值

子组件：

父组件：

补充知识：vue-router中的组件怎么传递参数

第一种方法params

 {
   path: '/user/:userid',
   component: User
  },

用户


export default {
 name: 'App',
 data() {
  return {
   userid: 'lisi'
  }
 }
}

第二种 query

 {
   path: '/profile',
   component: Profile
  }

profile
  

以上这篇Vue 组件的挂载与父子组件的传值实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。