原来写法:vuex3版本 read more
vue-element-ui使用嵌套drawer时audio会出现收缩
我在使用vue-element-ui中的drawer组件中,使用嵌套方式,子drawer里面放入audio音频文件,音频文件会出现收缩现象。
解决方法:
我使用的方式是,在打开动画完成后,重新给audio的src数据赋值。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<el-drawer title="历史记录" :visible.sync="currenthistory" direction="rtl" size="300" > <el-table :data="tableData" @row-click="handleCurrentChange"> <el-table-column property="result" label=" 结果" width="100" ></el-table-column> <el-table-column property="create_time" label="日期" width="200" ></el-table-column> </el-table> <el-drawer title="" :append-to-body="true" :before-close="handleClose" :visible.sync="innerDrawer" @opened = "onloaddata" > <audio ref="audio" controls controlsList="nodownload" :src="currentrow.file_url" ></audio> |
我们要使用drawer的opened事件,也就是Drawer 打开动画结束时调用下面方法,重新加载数据。
1 2 3 |
onloaddata(){ this.currentrow = this.tempcurrentrow } |
当数据重新加载后,第一次渲染出现的个别audio收缩现象解决。
vue实现条件判断动态绑定样式的方法
<el-tag type=
"success"
>绿色标签</el-tag>
<el-tag type=
"info"
>灰色标签</el-tag>
写函数也好,还是直接三元表达式都行
1 2 3 |
<el-tag size="medium" :type="scope.row.is_multiple === '否' ? 'info' : 'success'" >{{ scope.row.is_multiple }} </el-tag> |
vue 多个变量赋相同值互相影响
解决:
1.this.billItemLIsts = JSON.parse( JSON.stringify(this.billItemLIstsOriginal) );
2.或使用 ES6 的解析语法 this.billItemLIsts = { …this.billItemLIstsOriginal }
javascript 跳出(终止)forEach循环
forEach 用 break和return false都是无用的。break会报错
那怎么办?就是用try-catch
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
try { var array = ["first","second","third","fourth"]; // 执行到第3次,结束循环 array.forEach(function(item,index){ if (item == "third") { throw new Error("EndIterative"); } alert(item);// first,sencond }); } catch(e) { if(e.message!="EndIterative") throw e; }; // 下面的代码不影响继续执行 alert(10); |
vue-cli开启https
找到: vue.config.js
文件
1 2 3 4 5 |
module.exports = { devServer: { https: true } } |
VUE中加入新手引导
vue element ui NavMenu 导航菜单修改样式
在vue中的scss中去掉scoped 就可以修改样式了
vue-cli创建的项目复制到另一个目录问题
有时你可能复制项目到另一个机器开发,但是你发现运行npm run 出现问题。
其实很简单
我们删除\node_modules下的所有文件。运行
1 2 |
npm install npm run serve |
OK,问题已解决
如何使用setInterval或setTimeOut同步执行?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
function foo(args1, args2, retry) { return new Promise(function(resolve, reject) { if (retry <= 0) reject(); var isDone = callAnotherFunction(args1, args2); if(!isDone) { setInterval(function() { retry = retry - 1; isDone = callAnotherFunction(args1, args2); if (isDone) resolve(); }, 2000); } else resolve(); } } function useIt(args1, args2) { // Other code let store = function() { foo(args1, args2, 5).then(result => { cleanStorage(args1, args2); return; } } } |