javascript - vue的單文件組件如何拼成一個(gè)頁(yè)面？
問(wèn)題描述
比如我現(xiàn)在有一個(gè)top.vue 和bottom.vue怎樣能作為頁(yè)面的header和footer在每一個(gè)頁(yè)面中調(diào)用呢？
問(wèn)題解答
回答1：在需要應(yīng)用組件的頁(yè)面
import headTop from ’../../components/header/head’
<head-top :head-title='loginWay? ’登錄’:’密碼登錄’' goBack='true'></head-top>回答2：某個(gè)項(xiàng)目的app.vue文件:
<template> <p id='app'> //在這里調(diào)用你的組件 <TopContainer></TopContainer> <BHeader></BHeader> <BContent :rows='rows'></BContent> <BNavSide :options='options' v-on:change='isShowMask'></BNavSide> <p ref='mask' v-show='showMask'></p> </p></template><script>//在這里import組件import TopContainer from ’components/common/TopContainer.vue’import BHeader from ’components/common/BHeader.vue’import BContent from ’components/content/BContent.vue’import BNavSide from ’components/nav/BNavSide’import { mapGetters } from ’vuex’export default { name: ’app’, //在這里寫(xiě)用到的組件 components: { TopContainer, BHeader, BContent, BNavSide }}</script>授人以魚(yú)不如授人以漁，根據(jù)上面的方法就可以解決你的問(wèn)題了回答3：
注冊(cè)全局組建就行了呀
回答4：vue-cli 按照webpack-simple模板生成一個(gè)vue項(xiàng)目摸索一下就知道單文件組件怎么用了
回答5：建個(gè)組件文件夾，里面分解成header,footer什么的.vue模塊，然后通過(guò)import分別導(dǎo)入引用模塊。
回答6：導(dǎo)入組件，注冊(cè) components
相關(guān)文章：
1. [python2]local variable referenced before assignment問(wèn)題2. 求救一下，用新版的phpstudy，數(shù)據(jù)庫(kù)過(guò)段時(shí)間會(huì)消失是什么情況？3. javascript - 求幫助 , ATOM不顯示界面!!!!4. mysql - 請(qǐng)問(wèn)數(shù)據(jù)庫(kù)字段為年月日，傳進(jìn)的參數(shù)為月，怎么查詢(xún)那個(gè)月所對(duì)應(yīng)的數(shù)據(jù)5. python - 如何判斷字符串為企業(yè)注冊(cè)名稱(chēng)6. php - 微信開(kāi)發(fā)驗(yàn)證服務(wù)器有效性7. python中怎么對(duì)列表以區(qū)間進(jìn)行統(tǒng)計(jì)？8. javascript - 我的站點(diǎn)貌似被別人克隆了， google 搜索特定文章，除了域名不一樣，其他的都一樣，如何解決？9. javascript - js setTimeout在雙重for循環(huán)中如何使用？10. html - 移動(dòng)端radio無(wú)法選中
網(wǎng)公網(wǎng)安備