Aquí esta el ejemplo de mi problema: https://jsfiddle.net/m7g1uwL7/30/
si solo cambio el app.v_total
por que los input pierden sus check que pongo con v-if
? (creo que es por que VUE cree que test
también se actualiza) y no debería de ser así.
Stack Overflow en español es un sitio de preguntas y respuestas para programadores y profesionales de la informática. Solo te toma un minuto registrarte.
Regístrate para unirte a esta comunidadAquí esta el ejemplo de mi problema: https://jsfiddle.net/m7g1uwL7/30/
si solo cambio el app.v_total
por que los input pierden sus check que pongo con v-if
? (creo que es por que VUE cree que test
también se actualiza) y no debería de ser así.
El problema que veo es que si bien al iterar en lo elementos obtienes el checked
si cumple o no la función cuando este valor se cambia no persiste ya que no se guarda en algún model y que al cambiar un valor de tu componente Vue
este se refresca con los datos que persisten por ello no guarda los checks que hagas después. Para solucionar eso añadí al input v-model="date.check"
que guardaría si esta con check y que por medio de esa variable deberías controlar si price==0
.
const app = new Vue({
el: '#mainCreate',
data: {
v_total : 0,
test : [],
},
});
function f_test(){
var d = [
{title : 'p1', price : 0, check: true},
{title : 'p2', price : 2, check: true},
{title : 'p3', price : 0, check: true},
{title : 'p4', price : 4, check: true}
]
$.each(d, function(index,date){
Vue.set(app.test, index, date);
});
}
function changeV(){
app.v_total += 10;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://unpkg.com/vue"></script>
<div id="mainCreate">
<h4>I input the charge with a check according to a v-if, but look what happens if I select an input that was not checked and change the value of v_total .... reload the input</h4>
v_total = {{ v_total}}
<br>
<span v-for="date in test">
{{ date.title }}
<input type="checkbox"
name="featuresBox"
v-model="date.check">
<br>
</span>
<button onClick="f_test()">create object</button>
<button onClick="changeV()">change app.v_total</button>
</div>