Espero alguien me pueda orientar con mi problema.
Tengo un Select y mi intención es que cuando cambie a cierto valor, una casilla de texto se habilite o desabilite según sea el caso.
¿Cómo lo puedo hacer con Vuejs ?
Antes lo hacia con Jquery y era así: (En este ejemplo cuando seleccionas del Select al país Mexico se habilitan los inputs de los contrario se vuelven a desabilitar)
$(document).ready( function(){
//Al cargar la página se debilitan los inputs
$('#estado').attr('disabled', true);
$('#ciudad').attr('disabled', true);
//Sí el usuario selecciona el país Mexico se habilitan los inputs
$('#pais').on('change', function(){
var conf = $('#pais').val();
if (conf === "México") {
$('#estado').removeAttr('disabled');
$('#ciudad').removeAttr('disabled');
}else {
$('#estado').attr('disabled', true);
$('#ciudad').attr('disabled', true);
$('#estado').val('');
$('#ciudad').val('');
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<div class="container pt-5">
<div class="col-md-6">
<div class="form-group">
<select name="pais" id="pais" class="form-control" required>
<option value="" selected>Seleccione...</option>
<option value="México">México</option>
<option value="España">España</option>
<option value="Colombia">Colombia</option>
<option value="Venezuela">Venezuela</option>
<option value="Perú">Perú</option>
</select>
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label>Estado:</label>
<input type="text" name="estado" id="estado" class="form-control">
</div>
</div>
<div class="col-md-3">
<div class="form-group">
<label>Ciudad:</label>
<input type="text" name="ciudad" id="ciudad" class="form-control">
</div>
</div>
</div>