ul.for li.xunhuan(v-for='(v,index) in this.$store.state.Student.testList.questionList',:class='v.state').inline 第{{numberArr[index]}}题 data(){ return { numberArr:["一","二","三","四","五","六","七","八","九","十"] } },
效果 比如 第1个 改为 第一个
相当于 把index的1变为汉字一
******************************************华丽分割线******************************************
ReleaseTest(e) { // 发布随堂小测! this.testState = false; this.testTime = +e * 60; // this.testTime = +e; //扩展属性state用来控制课堂测试的是否完成 本来没有的，下面的代码是扩展一个state this.classhome.information.list[this.index].courseDataList[this.testIndex].state = true; console.log(this.classhome.information.list[this.index].courseDataList[this.testIndex]); this.wsurl.send( JSON.stringify({ type: 0, courseDatatype: "随堂小测", courseDataId: this.caseList.id, courseDataName: this.caseList.name, courseId: this.classhome.home.id, msg: e }) );******************************************华丽分割线******************************************
this.modal.name=this.modal.name.trim(); //trim() 去掉字符序列左边和右边的空格
******************************************华丽分割线******************************************
.line { width: 290px; margin-left: -10px; background-color: #E9EEF2; height: 1px; border: none; }
最近在写项目的时候遇到一个地方需要将hr的颜色设置为红色，
hr默认是一条灰色的一个像素的;
首先想到的是color属性，但是设置了并没有用，因为color一般都是针对字体颜色的，线条需要用background-color；但是当我设置了background-color : red时，线条仍然是灰色的，所以我们需要给线条一个高度，也就是1px；此时hr是这样的：
设置完后，在浏览器中可以看到原来的灰色还是存在的； 原来，hr是有默认的border的，我们需要将它的边框去掉，设为border:none； 这样就OK啦！
******************************************华丽分割线******************************************
mounted() { document.getElementsByClassName("student")[0].style.background = "#5A616E"; } destroyed() { document.getElementsByClassName("student")[0].style.background = "#FFF"; } //解决在css样式 对 类名为student 修改 background 无效 问题 // mounted(){} 载入后钩子 用js获取到 类名为student 设置他的 background // destroyed(){} 销毁后钩子 用js获取到 类名为student 把他的 background 设置回去 // 这样不影响其他组件的背景色 完美解决
******************************************华丽分割线******************************************
Vue生命周期中mounted和created的区别
https://blog.csdn.net/xdnloveme/article/details/78035065
******************************************华丽分割线******************************************
vue中引入第三方字体图标库iconfont，及iconfont引入彩色图标
https://www.cnblogs.com/goloving/p/8855794.html
https://blog.csdn.net/qq_32113629/article/details/79740949
<template lang="pug"> div.bottom i.icon  svg.svg(aria-hidden="true") use.use(xlink:href="#icon-laoshi") <template> <style lang="stylus"> @font-face { font-family: 'iconfont'; /* project id 443803 */ src: url('//at.alicdn.com/t/font_443803_vnkniczvjfn.eot'); src: url('//at.alicdn.com/t/font_443803_vnkniczvjfn.eot?#iefix') format('embedded-opentype'), url('//at.alicdn.com/t/font_443803_vnkniczvjfn.woff') format('woff'), url('//at.alicdn.com/t/font_443803_vnkniczvjfn.ttf') format('truetype'), url('//at.alicdn.com/t/font_443803_vnkniczvjfn.svg#iconfont') format('svg'); } .bottom { height: 50px; .icon { font-family: 'iconfont' !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; } .svg { width: 16px; height: 16px; .use { } } } <style>
*******************************************华丽分割线******************************************
默认只进行第一次匹配操作的替换，想要全局替换，需要置上正则全局标识g
span.endTime {{v.endTime.substr(0,9).replace(/-/g,'/')}}
******************************************华丽分割线******************************************
遍历对象[{isTure:true},{isTure:true},{isTure:false},{isTure:false},]
for (let index = 0; index < this.data.xuanhuanData.length; index++) { console.log(111); console.log(this.data.xuanhuanData[index].isTrue); if (this.data.xuanhuanData[index].isTrue) { num++; } }
******************************************华丽分割线******************************************
解决方案，封装 签到框模块延时3秒消失函数 利用vue生命周期钩子函数
updated() { // 当signText 的内容从 签到 》 签到成功 执行 签到框模块延时3秒消失函数 if(document.getElementsByClassName("signText")[0].innerHTML ==="签到成功"){ this.SignInClose(); } },updated() {}生命周期钩子函数中数据已经更改完成
******************************************华丽分割线******************************************
WebSocketclose() { alert("你已经掉线，请重新连接！"); this.$router.go(0); //刷新网页 }
WebSocket的事件触发机制
https://blog.csdn.net/ll666634/article/details/79028930
