首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

Vue中filter过滤器的使用方法

Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。...只能在当前 vue 对象中使用 filters: { dataFormat: (msg, a) => { // msg表示要过滤的数据,a表示传入的参数...return msg + a; } } } 组件使用方法 {{ msg | dataFormat('!')}}...会采用局部过滤器,即:局部过滤器优先于全局过滤器被调用 一个表达式可以使用多个过滤器,其执行顺序从左往右,前一个过滤器的结果作为后一个过滤器的被处理数据,所以要注意使用顺序 全局过滤器 全局过滤器我们使用Vue.../utils' Object.keys(filters).forEach(key => { Vue.filter(key, filters[key]) }) 在项目任意组件使用 <!

1.7K1513

Vue中如何使用方法、计算属性或观察者

熟悉 Vue 的都知道 方法methods、计算属性computed、观察者watcher 在 Vue 中有着非常重要的作用,有些时候我们实现一个功能的时候可以使用它们中任何一个都是可以的,但是它们之间又存在一些不同之处...text"> {{fullName}} methods 方式 var vm = new Vue...this.secondName; } }, mounted () { this.getFullName(); } }); computed 方式 var vm = new Vue...fullName () { return this.firstName + "" + this.secondName; } } }); watcher 方式 var vm = new Vue...methods 方法 在我们使用 Vue 时可能会有很多方法会被放到这里,比如它可能是我们的事件处理方法,一些操作方法的逻辑等等,但是它不能跟踪任何依赖,而且还会在每次组件重新加载时都会执行,这就会导致我们的方法会执行很多次

1.3K20

Vue3中条件语句的使用方法和相关技巧

概述在Vue3的开发中,条件语句是非常常用的语法之一。通过条件语句,我们可以根据不同的条件来渲染不同的内容,从而实现动态的展示和交互。本文将详细介绍Vue3中条件语句的使用方法和相关技巧。...图片2. v-if指令v-if指令是Vue3中最基本的条件语句指令,它用于根据条件判断是否渲染HTML元素。当条件为真时,对应的HTML元素会被渲染;当条件为假时,对应的HTML元素会被移除。...总结条件语句是Vue3中非常重要的一部分,它可以根据不同的条件来动态展示和交互。...本文详细介绍了Vue3中条件语句的使用方法和相关技巧,包括v-if指令和v-show指令的基本用法,以及条件语句的注意事项。希望通过本文的介绍,您对Vue3中条件语句有了更深入的理解和掌握。

33850

Webpack的异步加载原理及分包策略(深度好文,建议收藏)

vue 路由懒加载有以下三种方式 vue 异步组件 ES6 的 import() webpack 的 require.ensure() vue 异步组件 这种方法主要是使用了 resolve 的异步机制...看到这两张图的时候,我内心是崩溃的,槽点如下 打包后生成多个将近 1M 的 js 文件,其中不乏 vendor.js 首页必须加载的大文件 xlsx.js 这样的插件没必要使用,导出 excel 更好的方法应该是后端返回文件流格式给前端处理...(为了更好地呈现优化效果,我们先把 xlsx.js 去掉) vue.config.js 修改如下: chainWebpack: config => { config.optimization.splitChunks...配置 externals configureWebpack: (config) => { config.externals = { vue: 'Vue', xlsx: 'XLSX'...这时基本没有打包出大文件了,首页加载需要的 vendor.js 也只有几十 kb,而且我们还可以进一步优化,就是把 vue 全家桶的一些模块再通过 cdn 的方法引入,比如 vue-router,vuex

4.3K31
领券