vue自定义公共组件components

来源：互联网发布：ubuntu下mplayer 编辑：程序博客网时间：2024/05/17 21:56

之前vuejs项目中（参考别人项目）制作公共网站导航头，今天准备侧导航发现我只仅仅“知其让而不知其所以然”，所以研究了一下components:

//主页面框架用来嵌入:Main.vue<template><div><head-top></head-top><el-row style="margin-top: 71px;"><el-col :span="24" ><asideNav></asideNav><router-view class="router-view-box"></router-view></el-col></el-row><mycomponents></mycomponents></div></template><script>import headTop from '../components/headTop';import asideNav from '../components/asideNav';export default {name: 'main',components: {headTop,//<head-top></head-top>asideNav,//<asideNav></asideNav>"mycomponents":{template:'<div><h1>局部自定义组件</h1></div>'}}}</script><style scoped>* {margin: 0;padding: 0;}html {width: 100%;height: 100%;}</style>

 <!--展开折叠开关-->        <div class="menu-toggle" @click.prevent="collapse">          <i class="iconfont icon-menufold" v-show="!collapsed"></i>          <i class="iconfont icon-menuunfold" v-show="collapsed"></i>        </div> methods: {      //折叠导航栏      collapse: function () {        this.collapsed = !this.collapsed;      }}

阅读全文

0 0