Vue
Vue学习
WannaRunning
这个作者很懒,什么都没留下…
展开
-
Vue中el-table组件的值转换
在el-table组件中,字段值的转换有多种实现方式: 1.使用template标签加{{}}表达式使用js方法对字段值进行转换。 2.直接使用el-table-column组件中的:formatter属性使用js方法对值进行转换。 示例代码 <el-table-column label="货物状态" align="left" prop="status" width="80px"> <template slot-scope="scope"> <span&.原创 2021-08-17 18:31:30 · 4088 阅读 · 0 评论 -
Vue中的watch使用
watch和computed很相似,watch用于观察和监听页面上的vue实例,当然在大部分情况下我们都会使用computed,但如果要在数据变化的同时进行异步操作或者是比较大的开销,那么watch为最佳选择。watch为一个对象,键是需要观察的表达式,值是对应回调函数。值也可以是方法名,或者包含选项的对象。 使用示例 对日期组件观察,当值变化时做赋值处理操作,把组件绑定的checkTime参数这个数组中的两个时间分别赋值给checkTimeBegin和checkTimeEnd两个字段 <原创 2021-08-17 18:13:06 · 332 阅读 · 0 评论 -
JS中的for循环和break
js中for循环有多种实现方式,在写的时候发现forEach的方式是不兼容break语法的。 使用传统的for循环 这种方式支持continue,也支持break语法 for(var i=0, len = methodInfoList.length ; i< len ; i++){ if(methodInfoList[i].value == null || methodInfoList[i].value == "") { this.msgError("检查方法不能输入空值"); b原创 2021-08-04 20:56:21 · 7251 阅读 · 1 评论 -
Vue页面路由的两种实现方式
近期的工作中硬着头皮写了一堆前端的东西,后台系统的页面马马虎虎也就那么回事。 常见的页面路由场景要么是在列表点击关键字跳转详情页,要么就是选中一条记录,通过按钮跳转到新页面展示详情信息。 this.$router.push() 使用router.push()方法,这个方法会向history栈添加一个新纪录,所以,当用户点击浏览器后退按钮时,会回到之前的URL。 push方法除了path变量指定地址外,还可以使用 query 传递参数,参数名为 query <el-button typ.原创 2021-08-02 22:51:31 · 1478 阅读 · 0 评论 -
Vue基础(2)——v-for,v-if 语法
v-for即for循环 如果遍历的对象是数组,表达式的格式为:(T,index) inList<T>,其中T是对象类型;如果遍历的目标是对象,表达式的格式为:(v,k,i)in T ,其中v是键的值,k是键,i是索引,T是对象 v-if表示判断 当表达式为true是展示标签内容,false时不展示 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">...原创 2021-03-24 00:23:07 · 1334 阅读 · 0 评论 -
vue基础(1)——数据绑定,事件,事件修饰符
vue中使用new Vue() 的方式可以实现数据到页面元素的双向绑定。 使用Vue内的el参数绑定标签的id建立关联,data参数定义标签需要绑定的数据,methods参数定义函数集合 标签内使用{{field}} 绑定数据到标签内; 标签内使用 v-model="field" 可以实现标签到数据model的双向绑定; 按钮标签使用 v-on:click="函数或简单代码逻辑" 可以实现点击事件。 <!DOCTYPE html> <html lang="en"> .原创 2021-03-22 22:24:30 · 176 阅读 · 0 评论