vue多视图
第一步 在app.vue中
<router-view class="b" name="header"> </router-view>
<router-view class="b" > </router-view> //不写name名字的就是默认路由
<router-view class="b" name="footer"> </router-view>
第二步 在router.js中
router.js
//引入组件
import header from './components/header.vue'
import footer from './components/footer.vue'
let router =new VueRouter({
routers:[
{
path:'/',
components:{ //components写多个必须加s,不然会报错
header:header
deafult:footer
footer:footer
}
},
]
})
*一次加载三个组件
vue多视图的更多相关文章
- vue命名视图实现经典布局
vue命名视图实现经典布局 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...
- vue路由 视图命名
<body> <div id="app"> <p @click="go">hello app!</p> < ...
- [vue ]滚动视图解决ElementUI NavMenu 导航菜单过长显示的问题
记录一下工作 需求 导航菜单过长的时候会溢出,需要一个像 Tabs 标签页一样的滚动视图容器,可以左右滚动内部视图. 解决方法 由于时间问题,所以直接将 Tabs 源码抽取出来使用. 这里要做一些特殊 ...
- vue 路由视图,router-view嵌套跳转
实现功能:制作一个登录页面,跳转到首页,首页包含菜单栏.顶部导航栏.主体,标准的后台网页格式.菜单栏点击不同菜单控制主体展示不同的组件(不同的页面). 配置router-view嵌套跳转需要准备两个主 ...
- vue 命名视图
命名视图 有时候想同时(同级)展示多个视图,而不是嵌套展示,例如创建一个布局,有 sidebar(侧导航) 和 main(主内容) 两个视图,这个时候命名视图就派上用场了.你可以在界面中拥有多个单独命 ...
- vue 控制视图
<!--第一种:点击改变容器的值--> <li> <a href="javascript:void(0)" @click="state.bo ...
- VUE 数据更新 视图没有更新
3.还有个小技巧 当数据已经更新了 但是视图没有更新的时候 比如 这里 视图并没有更新 说明aa这个方法中没有触发视图更新 只要这里面随便一个对象能触发更新 则所有的视图更新都会生效 在data中 ...
- VUE数据更新视图不更新的原因
当你利用索引直接设置一个项时,例如:vm.items[indexOfItem] = newValue当你修改数组的长度时,例如:vm.items.length = newLength 数组更新只能通过 ...
- 记 · ElemetnUI + Vue v-if 视图切换踩过的那些坑
使用EleUI 做一个用户登录窗口,需要用v-if 动态切换三个表单:手机登录.账密登录和密码找回.其中需要实现一个重置表单的功能,但其间出了一些小bug.密码找回表单中有三个表单项,手机登录和账密登 ...
随机推荐
- 461. Hamming Distance(汉明距离)
The Hamming distance between two integers is the number of positions at which the corresponding bits ...
- 适用于PHP初学者的学习线路和建议
[导读] 这篇文章是围绕PHP的学习问题,之前介绍过<重磅资料!Github上的PHP资源汇总大全><深入探讨PHP类的封装与继承><PHP的学习规划建议>等对PH ...
- Node 基本使用
node -v:查看node版本 npm -v:查看npm版本 npm install npm -g :升级npm版本 npm install <module_name> [-g]:安装指 ...
- bzoj 1296: [SCOI2009]粉刷匠【dp+背包dp】
参考:http://hzwer.com/3099.html 神题神题 其实只要知道思路就有点都不难-- 先对每一行dp,设g[i][j]为这行前i个格子粉刷了k次最大粉刷正确数,随便n^3一下就行 设 ...
- P4324 [JSOI2016]扭动的回文串
传送门 对\(A\).\(B\)串各跑一遍\(manacher\),求出第\(1\).\(2\)类扭动回文串的最大长度. 考虑第三类的扭动回文串\(S(i,j,k)\),一定可以表示为\(A(i,l) ...
- 百度地图API详细介绍
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...
- 51nod 1068 Bash游戏 V3
列出前几项可以发现是个规律题,不要被题目的文字所欺骗,字符串处理10^1000即可 #include <bits/stdc++.h> using namespace std; int ge ...
- ACM_棋棋棋棋棋(规律题)
棋棋棋棋棋 Time Limit: 2000/1000ms (Java/Others) Problem Description: 在遥远的K次元空间,一年一度的GDUFE-GAME又开始了.每年的GD ...
- PWA之serviceWorker应用
1.serviceWorker介绍service worker是一段运行在浏览器后台的JavaScript脚本,在页面中注册并安装成功后,它可以拦截和处理网络请求,实现缓存资源并可在离线时响应用户的请 ...
- 190 Reverse Bits 颠倒二进制位
颠倒给定的32位无符号整数的二进制位.例如,给定输入 43261596(二进制表示为 00000010100101000001111010011100 ),返回 964176192(二进制表示为 00 ...