Vue 填坑系列(持續更新...)

1.遇到頁面顯示不更新，數據已更新情況

   vue-cli中：

　　this.$nextTick(function () {

　　　this.x=x;

　　})

 

  以js引入vue的網頁中：

　　this.$set(this.data, index, {
   　　nodeId: id,

  　　    . . .
　　});

2.在vue 1.x系列中dialog嵌套dilog 出現遮罩混亂現象：

     我采用組件通信的方式解決，dilog中的點擊事件觸發最底層組件彈出新的dilog

3.vue1.x 系列中tree組件

renderContent(h, { node, data, store }) {
return (
　　<span>
　　<span>
　　<span>{node.label}</span>
　　</span>
　　<span style="float: right; margin-right: 20px">
　　<el-button size="mini" on-click={ () => this.append(store, data) }>Append</el-button>
　　<el-button size="mini" on-click={ () => this.remove(store, data) }>Delete</el-button>
　　</span>
　　</span>

　　);
}

無法使用 報錯:

修改為：

zrenderContent(createElement, { node, data, store }) {

　　let self=this;

　　return createElement('span', [ 
　　　　createElement('span', node.label), 
　　　　createElement('span', {attrs:{ style:"float: right; margin-right: 20px" 
　　}},[ 
　　createElement('el-button',{attrs:{ 
　　size:"mini" 
　　},on:{ 
　　click:function() { 
　　　　　console.info("點擊了節點" + data.id + "的添加按鈕"); 
　　　　　store.append({ id:"", label: 'testtest', children: [] }, data); 
　　} 
　　}},"添加小類信息"), 
　　createElement('el-button',{attrs:{ 
　　size:"mini" 
　　},on:{ 
　　click:function() { 
　　　　console.info("點擊了節點" + data.id + "的添加按鈕"); 
　　　　store.append({ id:"", label: 'testtest', children: [] }, data); 
　　} 
　　}},"修改"), 
　　createElement('el-button',{attrs:{ 
　　size:"mini" 
　　},on:{ 
　　click:function() { 
　　　　self.deleteRow(data.id);
　　} 
　　}},"刪除"), 
　　]), 
　　]); 
　}

4.打包項目，直接打開Index.html出錯，空白頁面

　　修改config-index.js-build-assetsPublicPath ‘/ ’為 ‘ ’

5.npm引入node-sass，需要安裝python2的報錯：

   采用 cnpm install node-sass --save-dev 可以解決！

 6.element-ui  Carousel 重新賦值數組全部都 display：none

  https://github.com/ElemeFE/element/issues/3161,setTimeout解決

       setTimeout(() => { this.$refs.imgcarousel.resetItemPosition(); },100)

7.element-ui Popover彈出框 ：Cannot read property '$refs' of undefined

 解決：1. ref="popover" 里面不允許大寫 要和 v-popover:popover 保持一致

            2.el-popover 標簽放在v-popover:popover 標簽之前