estoy listando un objeto en una tabla con el método v-for, cada objeto lo voy iterando y mostrándolo, hasta ahí todo bien, aparte de los datos lleva un boton, los datos los estoy rescatando con php, (estoy usando laravel) pero necesito que cuando los itere si un estado sea igual a 3 (en ruta) que el botton desaparezca aca tengo mi codigo: Vuejs:
cargarPedidos() {
axios.get("api/despacho").then(({ data }) => (this.pedidos = data.data));
}
aca los itero:
<div class="card-body table-responsive p-0 mt-5">
<table class="table table-hover">
<tbody><tr>
<th>N° pedido</th>
<th>Cliente</th>
<th>Telefono</th>
<th>Hora ingreso</th>
<th>Vendedor</th>
<th>Estado Pedido</th>
<th>Tipo Venta</th>
<th>Tipo Pago</th>
<th>Emitir Despacho</th>
</tr>
<!-- /.lleno las latblas con v-for -->
<tr v-for="pedido in pedidos" :key = "pedido.codigo">
<td>{{pedido.codigo}}</td>
<td>{{pedido.nombre_cliente}}</td>
<td>{{pedido.telefono_cliente }}</td>
<td>{{pedido.registro }}</td>
<td>{{pedido.name }}</td>
<td>{{pedido.estado }}</td>
<td>{{pedido.nombre_venta }}</td>
<td>{{pedido.nombre_pago }}</td>
<td>
<a href="#" @click="editModal(pedido)">
<i class="fa fa-edit"></i>
</a>
<!--
<a href="#" @click="eliminarProducto(producto.id)" >
<i class="fa fa-trash"></i>
</a> -->
</td>
</tr>
</tbody>
</table>
</div>
La idea es que la lista donde aparece estado pedido que es estado 3 el boton desaparezca para que no se pueda editar.
Gracias de ante mano