錯誤過濾功能VueJs

我的組件以下是：

<template> 


     Search <input name="query" v-model="query" class="form-control"> 

     <table class="table"> 
      <thead> 
      <tr> 
       <th>User name</th> 
       <th>User email/th> 
       <th>Get logs</th> 
      </tr> 
      </thead> 
      <tbody v-for="user in filteredUsers"> 
      <tr> 
       <td> {{ user.firstname }} </td> 
       <td> {{ user.lastname }} </td> 
       <td> <a v-on:click="getUserLogs(user.user_id)">Show</a> </td> 
      </tr> 
      </tbody> 
     </table> 
    </div> 
</template> 

<script> 
    import ConnectionService from '../../components/services/ConnectionService'; 
    const connectionService = new ConnectionService(); 

    export default { 
     data() { 
      return { 
       users: [], 
       query: '', 
       betweenDates: { 
        from: '', 
        to: '' 
       }, 
       logs: {}, 
       logsVisibility: false 
      } 
     }, 

     created() { 
      this.getUsers(); 
     }, 

     computed: { 
      filteredUsers() { 
       return this.findBy(this.users, this.query, 'lastname') 
      } 
     }, 

     methods: { 
      getUsers() { 

       this.$http.get(hostname + 'name=person_list&session_id=' + sessionApiId).then(response => { 
        this.users = connectionService.renderMultipleInstances(response.body); 
       }, response => { 
        // error callback 
       }); 
      }, 


      getUserLogs(id) { 
       let self = this; 

       axios.post('/logs/get_user_logs', { 
         userId: id,      
        }).then(function (response) { 
         self.logs = response.data; 
         self.logsVisibility = true; 
         console.log(response.data); 
        }); 
       }, 

      findBy(list, value, column) { 
       return list.filter(function (item) { 
        return item[column].includes(value) 
       }) 
      } 
     } 
    } 
</script>

，我有以下的數據通過它來過濾：

users:Array[4095] 
    0:Object 
     firstname:"Анастасия" 
     id:206 
     lastname:"Никифорова" 
     middlename:"Юрьевна" 
     user_id:192 
    1:Object 
     firstname:null 
     id:3362 
     lastname:null 
     middlename:null 
     user_id:2046 
...

錯誤如下：

[Vue warn]：渲染函數錯誤：「TypeError：Can not讀屬性'包括'爲空'

來源

2017-05-24 ILya

1：對象lastname:null。它會導致你的錯誤您可以返回之前添加一行

item[column] || (item[column] = '');

或

return list.filter(function (item) { 
    return (item[column] || '').includes(value) 
})

來源

2017-05-24 13:53:07

謝謝，它幫助 – ILya

我有一個類似的問題來解決它，我取代從我的對象與「」（空字符串）每一個空值

來源

2018-02-22 18:16:50

錯誤過濾功能VueJs

回答

相關問題