全局組件引入源祈,使用更方便
在main.js中使用 ‘vue.component(‘組件名’, ‘組件對(duì)象’);’
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/>'
})
父組件傳輸數(shù)據(jù)到子組件
//父組件中發(fā)送數(shù)據(jù)
<template>
<div>
<viewMain :type="type" v-bind:textTwo="type" textOne="父組件傳值"></viewMain>
</div>
</template>
// 子組件中接收數(shù)據(jù)
<script>
import info from '../components/info'
export default {
props:['textOne', 'textTwo', 'type']
}
</script>
全局組件之間數(shù)據(jù)傳輸
創(chuàng)建全局js文件
使用emite等
頁面之間數(shù)據(jù)傳輸push
testParams() {
this.$router.push({
// 傳遞參數(shù)
name:'newsDetail', query:{id:1, name:'query2'}, params:{id:2,name:'params2'}
});
}
接收
created() {
// 數(shù)據(jù)初始化 獲取路由參數(shù)
// $route (數(shù)據(jù)) $router (功能函數(shù))
alert(this.$route.params.name)
alert(this.$route.query.name)
},