账号密码登录
忘记密码注册账号
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
获取验证码
找回密码返回
邮箱找回 手机找回
获取验证码
注册账号返回
获取验证码
其他登录方式
登录即同意《用户使用协议》和《用户隐私条款》
问答主页 -> 电脑网络
分享
  • 收藏
    X
    Vue2.x里data里的值改变filter不断调用的问题
    32
    0

    问题如题，vue2.x里data里的属性导致其它data属性的filter不断调用的问题（下面的代码控制台会不断打出---filter）。这是bug，还是有其它配置可以设置？ 引用 https://segmentfault.com/q/1010000007361021?_ea=1323594提问

    <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  <div id="app">
    {{str}} = {{str | myUppercase}}<br>
    {{index}} = {{myIndex}}
  </div>
  <script src="//cdn.bootcss.com/vue/2.0.3/vue.js"></script>
  <!--<script src="//cdn.bootcss.com/vue/1.0.28/vue.js"></script>-->
  <script>
    var vm=new Vue({
      el:"#app",
      data:{
        index:0,
        myIndex:0,
        str:'hello'
      },
      mounted:function(){
        var vm=this;
        setInterval(function(){
          vm.index++;
        },200);
      },
      /*created:function(){
        var vm=this;
        setInterval(function(){
          vm.index++;
        },200);
      },*/
      filters:{
        myUppercase:function(value){
          console.log('---filter');
          if(!value) return '';
          value=value.toString();
          return value.toUpperCase();
        }
      },
    })
  </script>
</body>
</html>
    1
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得：提问者悬赏的 10 元积分
        全部回答
    • 共 0 条
    • 执白先行 普通会员 1楼

      在Vue2.x中，data里的值改变后，如果需要对这个值进行过滤，那么在计算属性或者Vue提供的API中，可以使用filter方法。下面是一个简单的例子：

      假设我们有一个数组：

      javascript const arr = [ { id: 1, name: 'Tom', age: 10 }, { id: 2, name: 'Jerry', age: 20 }, { id: 3, name: 'Spike', age: 30 }, ];

      我们可以使用filter方法来过滤出年龄大于30的用户：

      javascript const filteredArr = arr.filter(item => item.age > 30); console.log(filteredArr);

      在这个例子中，filter方法接受一个函数作为参数，这个函数会遍历数组中的每个元素，如果这个元素的年龄大于30，那么这个元素就会被保留下来。这样，我们就可以得到一个只包含年龄大于30的用户的新数组。

      需要注意的是，filter方法不会改变原数组。如果你想改变原数组，你需要使用concat或者splice等方法。

    0 打赏 回复
    更多回答
    网站公告
    扫一扫访问手机版

    回答动态

    • 回到顶部
    • 回到顶部