estoy empezando con vue js, tengo un tabla que muestra los datos de un json, y un buscador que filtra los resultados. El problema es que solo consigo que filtre a partir de un valor (item.noticia_titulo_cas), alguien sabe como podría filtrar el resultado desde cualquier valor del objeto js? Muchas gracias. Aquí el codigo js:
<script>
new Vue({
el: '#noticias',
created: function() {
this.getNoticias();
},
data: {
lists: [],
noticia_titulo_cas:''
},
methods: {
getNoticias: function() {
axios.get(urlNoticias).then(response => {
this.lists = response.data
});
}
},
computed:{
searchNoticia: function () {
return this.lists.filter((item) => item.noticia_titulo_cas.includes(this.noticia_titulo_cas));
}
}
});
</script>
Aquí el html:
<h3>Noticias</h3>
<a href="noticia-nuevo-editar.php">[nuevo]</a>
<input type="text" placeholder="Buscar" class="form-control pull-right" style="width:300px;" v-model="noticia_titulo_cas"> <!-- Aquí querría abarcar todo el contenido del objeto js-->
<table class="table table-hover table-responsive">
<thead>
<tr>
<th>Id</th>
<th>Fecha*</th>
<th>Título cas*</th>
<th>Trabajo*</th>
<th>Editar</th>
</tr>
</thead>
<tbody>
<tr style='width: 130px; overflow: auto;' v-for="item in searchNoticia">
<td>{{ item.idNoticia }}</td>
<td>{{ item.noticia_fecha }}</td>
<td>{{ item.noticia_titulo_cas }}</td>
<td>{{ item.lanak_titulo_cas }}</td>
<td><form action='noticia-nuevo-editar.php' method='POST'><input hidden name='idNoticia' v-bind:value="item.idNoticia"><input hidden name='idLanak' v-bind:value="item.idLanak"><button type='submit' class='btn btn-default btn-lg'><i class='fas fa-plus'></i></button></form></td>
</tr>
</tbody>
</table>
Es mi primera pregunta, perdón si algo no está correcto. Muchas gracias de antemano.