全局组件引入，使用更方便
在main.js中使用 ‘vue.component(‘组件名’, ‘组件对象’);’
Vue.config.productionTip = false
import createApplication from './components/createApplication.vue'
import createUser from './components/createUser.vue'
import toolBar from './components/toolBar.vue'
import viewMain from './components/viewMain.vue'
Vue.component('createApplication', createApplication);
Vue.component('toolBar', toolBar);
Vue.component('viewMain', viewMain);
Vue.component('createUser', createUser);
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
父组件传输数据到子组件
//父组件中发送数据
<template>
<div>
<viewMain :type="type" v-bind:textTwo="type" textOne="父组件传值"></viewMain>
</div>
</template>
// 子组件中接收数据
<script>
import info from '../components/info'
export default {
props:['textOne', 'textTwo', 'type']
}
</script>
全局组件之间数据传输
创建全局js文件
使用emite等
页面之间数据传输push
testParams() {
this.$router.push({
// 传递参数
name:'newsDetail', query:{id:1, name:'query2'}, params:{id:2,name:'params2'}
});
}
接收
created() {
// 数据初始化 获取路由参数
// $route （数据） $router （功能函数）
alert(this.$route.params.name)
alert(this.$route.query.name)
},
