vue: register and import
components/header-nav/menu-nav.vue
<template>
<div>
menu nav
</div>
</template>
components/header-nav/login-nav.vue
<template>
<div>
login nav
</div>
</template>
第一种方法:
components/header-nav/index.js
import MenuNav from "./menu-nav.vue";
import LoginNav from "./login-nav.vue"; export default {MenuNav, LoginNav}
components/header.vue
<template>
<header>
<menu-nav></menu-nav>
<login-nav></login-nav>
</header>
</template>
<script>
import MenuNav from "./header-nav;
import LoginNav from "./header-nav";
export default {
components: MenuNav,LoginNav
};
</script>
第二种方法
<template>
<header>
<menu-nav></menu-nav>
<login-nav></login-nav>
</header>
</template>
<script>
import MenuNav from "./header-nav/menu-nav.vue";
import LoginNav from "./header-nav/login-nav.vue";
export default {
components: {MenuNav,LoginNav}
};
</script>
vue: register and import的更多相关文章
- 在vue中使用import()来代替require.ensure()实现代码打包分离
最近看到一种router的写法 import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) const login = ...
- Vue 导入文件import、路径@和.的区别
***import: html文件中,通过script标签引入js文件.而vue中,通过import xxx from xxx路径的方式导入文件,不光可以导入js文件. from前的:“xxx”指的是 ...
- Element + Vue I18n动态import加载国际化语言包翻译文件
需求 项目为多页应用,包含产品a.b.c.d.e,每个产品都有自己的翻译文件.一次加载所有翻译文件是极度不合理的.于是考虑动态加载. 实现 参考官方文档:延迟加载翻译 项目结构 │ ├── dist ...
- vue中的import {} from '@/api/api'
例:import {queryDepartTreeList, searchByKeywords} from '@/api/api' 首先查看vue.config.js文件,在这个文件里面定义了定义了@ ...
- vue 中使用import导入 script 在线链接
一般我们在vue中导入另外一个文件或者文件中的方法,我们都是使用import来实现他的,那么问题来了,现在我们要导入的不是另外的一个文件,而是在线链接,这该怎么办?我们也使用了 import * as ...
- vue中的import、export、requre的区别
在es6之前js一直没有自己的模块语法,为了解决这种尴尬就有了require.js的出现.在es6发布之后js又引入了import的概念使得不清楚两者之间的区别的同学在实际使用过程中造成了自己的误解, ...
- Vue export和import
config/index.js export default '123456'; import strs from '@/config'; //此处直接写@config就可以, 如果是export ...
- vue中创建js文件使用export抛出函数,import引入后不能绑定HTML的问题
在es6中使用export和import实现模块化: js文件: export function test(x) { console.log(x); } vue组件: import {test} fr ...
- vue使用import来引入组件的注意事项
Vue使用import ... from ...来导入组件,库,变量等.而from后的来源可以是js,vue,json.这个是在webpack.base.conf.js中设置的: module.exp ...
随机推荐
- [py][mx]实现按照课程机构排名,按照学习人数排名
原型是 实现效果 因为要按照这两个指标排名, 模型中现在还没有这2个字段(整数),所以需要修改模型. 修改模型,添加2个排序指标的字段 class CourseOrg(models.Model): . ...
- 入坑-DM导论-第一章绪论笔记
//本学习笔记只是记录,并未有深入思考. 1.什么是数据挖掘? 数据挖掘是数据库中发现必不可少的一部分. 数据预处理主要包括(可能是最耗时的步骤): 1.融合来自多个数据源的数据 2.清洗数据以消除噪 ...
- 解决FlexPaper分页分段加载问题(转)
FlexPaper是一个开源的PDF文档在线查看控件.用户查看PDF文档不需要安装Acrobat Reader,但需要利用像SwfTools这样的工具预先将PDF文档转成SWF格式的文件.FlexPa ...
- uva10417 概率DP
这题 to[i][j] 为第i个人送j这个礼物的概率 我们用13进制进行压缩这个留下的的礼物的个数,这样我们将dp[i][k]表示为当第i个人放完礼物后得到的状态为k时的概率,那么通过记忆化搜索我们就 ...
- db2,oracle,mysql ,sqlserver限制返回的行数
不同数据库限制返回的行数的关键字如下: ①db2 select * from table fetch first 10 rows only; ②oracle select * from table w ...
- Flume环境安装
源码包下载: http://archive.apache.org/dist/flume/1.8.0/ 集群环境: master 192.168.1.99 slave1 192.168.1.100 sl ...
- mongo增删改查封装(C#)
Framework版本:.Net Framework 4 ConnectionUtil源码参见:https://www.cnblogs.com/threadj/p/10536273.html usin ...
- mongodb的分片(2)
在上一片博客,详细说明了mongodb的分片搭建的详细过程:分片搭建 在这里会说一些分片的维护与操作! 在集群搭建完,我们使用了sh.status()查看分片之后的数据,如下: #连接的是mongos ...
- CSS3:{*zoom:1;}作用
CSS3:{*zoom:1;}作用 zoom:1的常见作用: zoom是IE专用属性,firefox等是不支持的.它的本来作用是设置或检索对象的缩放比例,但这作用几乎用不到. 可以让网页实现IE7中的 ...
- 2017-2018-1 Java小组-1623 第二周作业
2017-2018-1 Java小组-1623 第二周作业 关于游戏软件的问题 讨论结果 20162301张师瑜 20162305李昱兴 20162306陈是奇 20162308马平川 2016231 ...