Vue+elementui开发小坑

- 阻止事件冒泡

hack:子元素@click改为@click.stop

- 监听路由

hack:

watch:{
    '$route.params.param':function(val){
        this.chooseToLoad(val)
    }
},
chooseToLoad:function (val) {
    if( val === 'ca' ){
    this.activeName = 'first';
    this.currentShow=false;
    }else if( val === 'my' ){
    this.activeName = 'second';
    this.currentShow=true;
}
},

- 表单验证 message消失不了

hack:
1. 检查rules规则
2. 检查是否上传/填写/选择成功

- JSON合并

var json = {};
var json1 = {a:1,b:1};
var json2 = {c:1,d:1};
json = eval('('+(JSON.stringify(json1)+JSON.stringify(json2)).replace(/}{/,',')+')');
// json: {a:1,b:1,c:1,d:1}

- 父组件传值

this.$parent.amount

- JSON对象属性名获取

for (key in json){

 key;       //名
json[key]; //值

}

点击按钮复制到粘贴板

https://clipboardjs.com/#example-target

npm install clipboard –save 安装

     <div id='copy-board'>
            aaa
     </div>

  <el-button class="btn" type="primary"
  data-clipboard-target="#copy-board"
  style="height:24px;line-height:0px;">
  Copy the link
  </el-button>

vue国际化
https://segmentfault.com/a/1190000008752459?from=timeline&isappinstalled=1

element ui导航默认展开

:default-opended="['1','2','3','4']"

vue离开当前页面提示

全局：
router.beforeEach((to, from, next) => {
  console.log(from);
  if(/updateCampaign/.test(from.path)){
    alert('1');
  }
});

组件中：

beforeRouteLeave(from,to,next){}

vue路由

https://segmentfault.com/a/1190000008879966

强制渲染

this.$set(this.tableData,index,obj);

vue配置host共享站点

build/dev-server.js,将其中的var uri = ‘http://localhost:’ + port改成你的
var url=”http://192.168.50.127”+port