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的更多相关文章

  1. vue2.0填坑有感(持续更新ing)

    1.请求数据 用本地json数据进行mock的时候,一般放在created 过程就Ok了,这样可以尽早获取数据:如果有依赖dom必须存在的清空,就放到mounted里面,具体用法如下所示: // cr ...

  2. 干货分享:vue2.0做移动端开发用到的相关插件和经验总结(2)

    最近一直在做移动端微信公众号项目的开发,也是我首次用vue来开发移动端项目,前期积累的移动端开发经验较少.经过这个项目的锻炼,加深了对vue相关知识点的理解和运用,同时,在项目中所涉及到的微信api( ...

  3. vue2.0做移动端开发用到的相关插件和经验总结

    最近一直在做移动端微信公众号项目的开发,也是我首次用vue来开发移动端项目,前期积累的移动端开发经验较少.经过这个项目的锻炼,加深了对vue相关知识点的理解和运用,同时,在项目中所涉及到的微信api( ...

  4. vue2.0实践的一些细节

    最近用vue2.0做了个活动.做完了回头发现,好像并没有太多的技术难点,而自己好像又做了比较久...只能说效率有待提升啊...简单总结了一些比较细节的点. 1.对于一些已知肯定会有数据的模块,先用一个 ...

  5. 用FSM一键制作逐帧动画雪碧图 Vue2 + webpack

    因为工作需要要将五六十张逐帧图拼成雪碧图,网上想找到一件制作工具半天没有找到,就自己用canvas写了一个. 写成之后就再没有什么机会使用了,因此希望有人使用的时候如果遇到bug了能及时反馈给我. 最 ...

  6. vue2.0构建淘票票webapp

    项目描述 之前一直用vue1.x写项目,最近为了过渡到vue2.0,特易用vue2.0栈仿写了淘票票页面,而且加入了express作为后台服务. 前端技术栈:vue2.0 + vue-router + ...

  7. Vuex2.0+Vue2.0构建备忘录应用实践

    一.介绍Vuex Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化,适合于构建中大型单页应用. ...

  8. 一步步构造自己的vue2.0+webpack环境

    前面vue2.0和webpack都已经有接触了些(vue.js入门,webpack入门之简单例子跑起来),现在开始学习如何构造自己的vue2.0+webpack环境. 1.首先新建一个目录vue-wk ...

  9. Vue2.0组件间数据传递

    Vue1.0组件间传递 使用$on()监听事件: 使用$emit()在它上面触发事件: 使用$dispatch()派发事件,事件沿着父链冒泡: 使用$broadcast()广播事件,事件向下传导给所有 ...

随机推荐

  1. vitess元数据跨机房灾备解决方案

    测试使用vitess的时候发现vitess元数据的实现有多种方案,etcd, etcd2, zk,zk2, 由于刚开始测试的时候使用的是基于k8s集群+etcd的,以下就分步说明灾备实现方案: 1. ...

  2. Redis 教程

    http://www.runoob.com/redis/redis-tutorial.html Redis系列(一)--安装.helloworld以及读懂配置文件 再开个redis系列,本系列打算不详 ...

  3. buffer/interger overflow /return-to-libc攻击实验

    buffer/interger overflow /return-to-libc攻击实验 http://blog.sina.com.cn/s/blog_70dd16910100rdgn.html ht ...

  4. pycharm的MySQLdb模块导不进去时解决办法

    一.Windows下python2.7安装MySQLdb模块 根据Python多少位下载对应版本: 32位:https://pypi.python.org/pypi/MySQL-python/1.2. ...

  5. 简明python教程七----面向对象的编程

    根据操作数据的函数或语句块来设计程序的,被称为面向过程的编程. 把数据和功能结合起来,用称为对象的东西包裹起来的组织程序的方法,称为面向对象的编程理念. 类和对象是面向对象编程的两个主要方面.类创建一 ...

  6. HTML 块级元素与行内元素

    1.块元素一般都从新行开始,它可以容纳内联元素和其他块元素,常见块元素是段落标签'P".“form"这个块元素比较特殊,它只能用来容纳其他块元素. 2.如果没有css的作用,块元素 ...

  7. Delphi 正则表达式语法(8): 引用子表达式 - 也叫反向引用

    Delphi 正则表达式语法(8): 引用子表达式 - 也叫反向引用 //准备: 我们先写一个搜索所有英文单词的表达式 var   reg: TPerlRegEx; begin   reg := TP ...

  8. SQL联接 外联接 内联接 完全联接 交叉联接

    联接分为: 内联接                        [inner join] 外联接        (左外联接,右外联接)        [left join/left outer jo ...

  9. 将php数组存取到本地文件

    存数组: <?php $data = array( "a" => "aaaaaa", "b" => "bbbbb ...

  10. hdu 1686 Oulipo kmp算法

    题目地址:http://acm.hdu.edu.cn/showproblem.php?pid=1686 题目: Problem Description The French author George ...