Question

我有一组从api获取的项目。 Bellow是我从服务器收到的数据示例。

{
    {"name": "example1", "price": 11, "vendor": "vendor_name1" },
    {"name": "example2", "price": 12, "vendor": "vendor_name2" },
    {"name": "example3", "price": 13, "vendor": "vendor_name3" },
}

为每个循环项分配数据属性edit: false，根据首选项将其从false切换为true。有没有办法设置选择性＆＃34; filterBy＆＃34;只能过滤带有编辑的项目：false并跳过过滤编辑：true？

请参阅示例：

Code Pen

感谢。

Answer 1

我通过克隆我编辑的项目来实现它。通过添加$ removeBy方法和$ clone

server {
    listen       80 default_server;
    listen       [::]:80 default_server;
    #server_name  _;
    root         /usr/share/nginx/html;

    include /etc/nginx/default.d/*.conf;

    location / {
     proxy_pass http://127.0.0.1:9000;
     proxy_http_version 1.1;
     proxy_set_header Upgrade $http_upgrade;
     proxy_set_header Connection 'upgrade';
     proxy_set_header Host $host;
     proxy_cache_bypass $http_upgrade;
    }

    error_page 404 /404.html;
        location = /40x.html {
    }

    error_page 500 502 503 504 /50x.html;
        location = /50x.html {
    }
}

工作示例在这里。

CodePen

Answer 2

You can set up a custom filter: http://vuejs.org/guide/custom-filter.html

Vue.filter('editing',function(obj){
  return !obj.edit;
});

Then in your view it would look like:

<div v-for="product in products | editing"></div>

条件filterBy用于使用子元素数据的v-for循环

2 个答案: