1.编写被引入的页面:

<template>
    <div id="mychart" :style="{width: '500px', height: '500px'}">{{msg}}</div>
</template>
<script>

export default {
  name: 'Footer',
  data () {
    return {
      msg: '【这里是外部页面传入的消息】'
    }
  },
  mounted(){
    this.drawLine();
    
  },
  methods: {

  }
}
</script>

2.在需要引入的页面import,

import Footer from "@/components/Footer"

from 后是被引入的页面的路径,"@"表示src目录.
3.在需要引入的页面加入被引入的页面

  components: { Footer },

4.使用被引入的页面

 <Footer></Footer>
Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐