vue2 遇到的问题汇集ing
1 、子路由
{
path: '/order-list', //订单列表
name: "order-list",
component(resolve) {
require.ensure(['../view/order/order-list.vue'], () => {
resolve(require('../view/order/order-list.vue'));
});
},
children: [{
path: '/order-list/order-list-detail', //订单详情页
name: "order-list-detail",
component(resolve) {
require.ensure(['../view/order/order-list-detail.vue'], () => {
resolve(require('../view/order/order-list-detail.vue'));
});
},
},]
},
path = 父路由 + 子路由名字
2、父组件往子组件传值 (props)
1、子组件是弹出框隐藏显示
传值参数 数据,判断true 和 false
条件:show 默认false
当点击按钮触发事件,使show设置true
子组件在展示代码:
<v-pay-detail :paylist="payData" :show="show" @isshow="isshow_child" />
2、父组件接受数据
data() {
return {
isshow: this.show
}
},
replace: true,
props: ['show', 'paylist'],
3、接受到show 通过监听赋值给isshow 为true 显示子组件
watch: {
show(val) {
let vm = this;
this.isshow = val;
if (this.isshow) {
vm.$nextTick(() => {
new BScroll('#scroll_section', {
deceleration: 0.001,
bounce: true,
swipeTime: 1800,
click: true,
});
})
}
}
},
4、当点击关闭时,子组件隐藏
isshow 设置false 同时必须让父组件的show 设置成false,就是把子组件的isshow = false 回传父组件
closed() {
this.isshow = false;
this.$emit('isshow', this.isshow);
},
5、@isshow="isshow_child" 触发isshow_child函数
isshow_child(msg) {
this.show = msg;
},
总结 子路由关闭一次,父组件也必须关闭一次。弹出框才正常显示,隐藏.
3、vuex 报错
Uncaught TypeError: Cannot read property 'id' of null
原因:
状态没有赋值
数据嵌套深
4、
4、vue2 数据循环超过三级会有错误警告,这是哪里出问题了么?
解决方法 初始值要给videoList赋一个let videoList={'data':{list:[]}};
vue2 遇到的问题汇集ing的更多相关文章
- vue2.0填坑有感(持续更新ing)
1.请求数据 用本地json数据进行mock的时候,一般放在created 过程就Ok了,这样可以尽早获取数据:如果有依赖dom必须存在的清空,就放到mounted里面,具体用法如下所示: // cr ...
- 干货分享:vue2.0做移动端开发用到的相关插件和经验总结(2)
最近一直在做移动端微信公众号项目的开发,也是我首次用vue来开发移动端项目,前期积累的移动端开发经验较少.经过这个项目的锻炼,加深了对vue相关知识点的理解和运用,同时,在项目中所涉及到的微信api( ...
- vue2.0做移动端开发用到的相关插件和经验总结
最近一直在做移动端微信公众号项目的开发,也是我首次用vue来开发移动端项目,前期积累的移动端开发经验较少.经过这个项目的锻炼,加深了对vue相关知识点的理解和运用,同时,在项目中所涉及到的微信api( ...
- vue2.0实践的一些细节
最近用vue2.0做了个活动.做完了回头发现,好像并没有太多的技术难点,而自己好像又做了比较久...只能说效率有待提升啊...简单总结了一些比较细节的点. 1.对于一些已知肯定会有数据的模块,先用一个 ...
- 用FSM一键制作逐帧动画雪碧图 Vue2 + webpack
因为工作需要要将五六十张逐帧图拼成雪碧图,网上想找到一件制作工具半天没有找到,就自己用canvas写了一个. 写成之后就再没有什么机会使用了,因此希望有人使用的时候如果遇到bug了能及时反馈给我. 最 ...
- vue2.0构建淘票票webapp
项目描述 之前一直用vue1.x写项目,最近为了过渡到vue2.0,特易用vue2.0栈仿写了淘票票页面,而且加入了express作为后台服务. 前端技术栈:vue2.0 + vue-router + ...
- Vuex2.0+Vue2.0构建备忘录应用实践
一.介绍Vuex Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化,适合于构建中大型单页应用. ...
- 一步步构造自己的vue2.0+webpack环境
前面vue2.0和webpack都已经有接触了些(vue.js入门,webpack入门之简单例子跑起来),现在开始学习如何构造自己的vue2.0+webpack环境. 1.首先新建一个目录vue-wk ...
- Vue2.0组件间数据传递
Vue1.0组件间传递 使用$on()监听事件: 使用$emit()在它上面触发事件: 使用$dispatch()派发事件,事件沿着父链冒泡: 使用$broadcast()广播事件,事件向下传导给所有 ...
随机推荐
- Powershell About Active Directory Group Membership of a domain user
使用Get-User命令去寻找group membership of a domain user $((Get-ADUser Wendy -Properties *).MemberOf -split ...
- 三.实例演示insert/update/delect更新数据库
1.逻辑图 2.只是准备 3.代码展示 import pymysql conn=pymysql.connect( host='192.168.199.249', port=3306, user='ro ...
- java正则匹配
java正则提取需要用到Matcher类,下面给出案例示例供参考 需要提取车牌号中最后一个数字,比如说:苏A7865提取5,苏A876X提取6import java.util.regex.Matche ...
- Linux学习笔记(7)CRT实现windows与linux的文件上传下载
Linux学习笔记(7)CRT实现windows与linux的文件上传下载 按下Alt + p 进入SFTP模式,或者右击选项卡进入 命令介绍 help 显示该FTP提供所有的命令 lcd 改变本地上 ...
- 爬虫任务一:使用httpclient去爬取百度新闻首页的新闻标题和url,编码是utf-8
第一个入手的爬虫小任务: maven工程 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi=" ...
- 【算法题12 解码方法decode way】
1.来源LeetCode91 一条包含字母 A-Z 的消息通过以下方式进行了编码: 'A' -> 1 'B' -> 2 ... 'Z' -> 26 给定一个只包含数字的非空字符串,请 ...
- APP 自动化测试封装结构模式
原文出处http://www.toutiao.com/a6268089772108333314/ 做过UI自动化测试同学,都会深深体会几个痛点:维护量大.适配量大.编写代码巨大等.基于这些问题,大家都 ...
- Java集合(1):ArrayList
Java容器类的用途是“保存对象”,分为两类:Map——存储“键值对”组成的对象:Collection——存储独立元素.Collection又可以分为List和Set两大块.List保持元素的顺序(有 ...
- java 获取request参数集
request里有两个方法 request.getParameterMap(); request.getParameterNames(); 我想用这两种方法获取. 1.用request.getPara ...
- Android MVP Presenter 中引发的空指针异常
一.概述 最近对 googlesamples/android-architecture 中的 MVP-dagger 进行了学习.对照项目的 MVP-dagger 分支,对 MVP-dagger 进行了 ...