javascript - Bagaimana untuk menggabungkan komponen fail tunggal vue ke dalam halaman?

Question

Sebagai contoh, saya kini mempunyai top.vue dan bottom.vue Bagaimana ia boleh dipanggil sebagai pengepala dan pengaki halaman dalam setiap halaman?

Answer 1

Pada halaman di mana komponen aplikasi diperlukan

    import headTop from '../../components/header/head'

<head-top :head-title="loginWay? '登录':'密码登录'" goBack="true">
</head-top>

Answer 2

Fail app.vue projek tertentu:

<template>
  <p id="app">
    //在这里调用你的组件
    <TopContainer></TopContainer>
    <BHeader></BHeader>
    <BContent :rows="rows"></BContent>
    <BNavSide :options="options" v-on:change="isShowMask"></BNavSide>
    <p class="wnd-mask" 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',

  //在这里写用到的组件

  components: {
    TopContainer,
    BHeader,
    BContent,
    BNavSide
  }
}
</script>

Lebih baik ajar lelaki memancing daripada ajar memancing mengikut kaedah di atas, anda boleh menyelesaikan masalah anda

Answer 3

Hanya daftar untuk penubuhan global dan itu sahaja

Answer 4

vue-cli menjana projek vue mengikut templat ringkas webpack dan anda akan tahu cara menggunakan komponen fail tunggal selepas menerokainya

Answer 5

Buat folder komponen, yang dipecahkan kepada modul pengepala, pengaki dan .vue lain, kemudian import modul rujukan masing-masing melalui import.

Answer 6

Import komponen dan daftar komponen