广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >vue中使用过滤器filters的this为undefined的问题
  • 368
分享到

vue中使用过滤器filters的this为undefined的问题

2024-04-02 19:04:59 368人浏览 泡泡鱼
摘要

目录使用过滤器filters的this为undefinedVue filter过滤器的用法使用过滤器filters的this为undefined vue中的过滤器更偏向于对文本数据的

使用过滤器filters的this为undefined

vue中的过滤器更偏向于对文本数据的转化,而不能依赖this上下文,如果需要使用到上下文this我们应该使用computed计算属性的或者一个method方法

vue filter过滤器的用法

{undefined{ args | filterFun }} |是管道符 用法如下

{{ time | fORMatDate }}

过滤器中

filters: {
        formatDate: value => {
           let date = new Date(value)
           let y = date.getFullYear()
           let MM = date.getMonth() + 1
           MM = MM < 10 ? "0" + MM : MM
           let d = date.getDate()
           d = d < 10 ? "0" + d : d
           let h = date.getHours()
           h = h < 10 ? "0" + h : h
           let m = date.getMinutes()
           m = m < 10 ? "0" + m : m
           let s = date.getSeconds()
           s = s < 10 ? "0" + s : s
           return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s
        }
    }

time 相当于想要过滤的值 传递给formatDate的参数

也可以多参数 {undefined{ time | formatDate(“嘿哈”) }}

这时过滤器中

//time 传递给 value    "嘿哈" 传递给 arg1
formatDate: (value,arg1) => {
    ......
}

以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。

--结束END--

本文标题: vue中使用过滤器filters的this为undefined的问题

本文链接: https://www.lsjlt.com/news/163428.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • vue中使用过滤器filters的this为undefined的问题
    目录使用过滤器filters的this为undefinedvue filter过滤器的用法使用过滤器filters的this为undefined vue中的过滤器更偏向于对文本数据的...
    99+
    2022-11-13
  • 解决vue过滤器filters获取不到this对象的问题
    目录vue过滤器filters获取不到this对象原理下面举个例子Vue filters this指向问题Vue实例中filter不依赖于当前vue实例上下文vue过滤器filter...
    99+
    2022-11-13
  • VUE中的filters过滤器如何使用
    这篇文章主要讲解了“VUE中的filters过滤器如何使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“VUE中的filters过滤器如何使用”吧!前言Vue.js 允许我们自定义过滤器,可...
    99+
    2023-06-29
  • VUE中的filters过滤器使用方法
    目录前言一、全局过滤器1、全局过滤器之单一挂载2、全局过滤器之批量挂载二、组件过滤器前言 Vue.js 允许我们自定义过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双...
    99+
    2022-11-13
  • Vue的filters过滤器怎么使用
    本篇内容主要讲解“Vue的filters过滤器怎么使用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Vue的filters过滤器怎么使用”吧!1、示例代码采用vue单文件组件,使用moment插...
    99+
    2023-07-04
  • Vue过滤器filters的用法及时间戳转换问题
    目录一.速识概念:二.局部过滤器:三.全局过滤器:四.扩展:五.总结:本文分享自华为云社区《三分钟掌握Vue过滤器filters及时间戳转换》,作者:北极光之夜。。 一.速识概念: ...
    99+
    2022-11-12
  • 一文详解Vue中过滤器filters的使用
    目录一、局部过滤器二、全局过滤器三、过滤器串联四、过滤器接收多个参数 Vue.js允许自定义过滤器,过滤器的作用可被用于一些常见的文本格式化(也就是修饰文本,但是文本内容不...
    99+
    2023-05-17
    Vue过滤器filters使用 Vue过滤器filters Vue过滤器
  • VUE中filters过滤器的两种用法实例
    目录前言一、全局过滤器全局过滤器之单一挂载全局过滤器之批量挂载二、组件过滤器附:过滤器中传入多个参数总结前言 Vue.js 允许我们自定义过滤器,可被用于一些常见的文本格式化。过滤器...
    99+
    2022-11-13
  • 解决vue局部过滤器获取不到this的问题
    目录vue局部过滤器获取不到thisvuefilters为什么获取不到this问题原因解决方法vue 局部过滤器获取不到this data里面加个字段赋值this。 <el-...
    99+
    2022-11-13
  • 关于vue中ref的使用(this.$refs获取为undefined)
    目录vue的ref(this.$refs获取为undefined)1.你在哪里调用,和你调用的对象2.调用对象是不是数组列表3.调用对象是否和v-if结合使用vue的$refs属性几...
    99+
    2022-11-13
  • Vue中的过滤器如何声明与使用
    这篇文章主要讲解了“Vue中的过滤器如何声明与使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Vue中的过滤器如何声明与使用”吧!一、什么是过滤器过滤器提供给我们的一种数据处理方式。过滤器...
    99+
    2023-07-05
  • 在Vue中使用防抖与节流,及this指向的问题
    目录使用防抖与节流,及this指向问题一顿操作后使用防抖函数所遇见的坑正常写法使用Vue中写法使用Vue中的watch的防抖简写使用防抖与节流,及this指向问题 最近项目中遇到了防...
    99+
    2022-11-13
  • Redis使用元素删除的布隆过滤器来解决缓存穿透问题
    目录前言缓存雪崩解决方案缓存击穿解决方案 缓存穿透解决方案布隆过滤器(Bloom Filter)什么是布隆过滤器位图(Bitmap)哈希碰撞布隆过滤器的2大特点fpp布隆过...
    99+
    2022-11-12
  • vue中使用hover选择器无效的问题
    目录使用hover选择器无效vue的hover鼠标悬停hover事件使用hover选择器无效 开头点题,先说结论,父组件z-index为负,鼠标根本无法位于组件上。 心情复杂,特地来...
    99+
    2022-11-13
  • Redis如何使用元素删除的布隆过滤器来解决缓存穿透问题
    这篇文章给大家分享的是有关Redis如何使用元素删除的布隆过滤器来解决缓存穿透问题的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。前言在我们日常开发中,Redis使用场景最多的就是作为缓存和分布式锁等功能来使用,而...
    99+
    2023-06-20
  • vue中使用sass及解决sass-loader版本过高导致的编译错误问题
    目录使用sass及解决sass-loader版本过高导致编译错误安装依赖包使用解决编译错误安装sass(规避因版本过高报错)安装的两个命令配置文件样式标签更改使用sass及解决sas...
    99+
    2022-11-13
  • 为什么 Linux 环境下使用 NumPy 是 Python 容器中的一个重要问题?
    Python 是一种高级编程语言,它在科学计算、数据分析和机器学习等领域都有着广泛的应用。而 NumPy 则是 Python 中一个重要的科学计算库,它提供了高效的多维数组操作和数学函数,是 Python 生态系统中重要的一部分。尤其是在...
    99+
    2023-10-04
    容器 numy linux
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作