Q:

dynamic object is changed when I modify another object VUE

Here is the example of my problem:

const app = new Vue({
  el: '#mainCreate',
  data: {
    v_total : 0,
    test : [],
  },
});
function f_test(){
  var d = [
    {title : 'p1', price : 0},
    {title : 'p2', price : 2},
    {title : 'p3', price : 0},
    {title : 'p4', price : 4}
  ]

  $.each(d, function(index,date){
    Vue.set(app.test, index, date);
  });
}

function changeV(){
 app.v_total += 10;
}
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></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-bind:checked="date.price == 0">
      <br>
    </span>

    <button onClick="f_test()">create object</button>
    <button onClick="changeV()">change app.v_total</button>
</div>

if I just change the app.v_total because the input loses its check that I put with v-if? (I think it's because VUE believes that the test is also updated) and it should not be that way.

A:

When you check a checkbox, you are "losing state" because nothing changes to the data.price of each checkbox, see:

const app = new Vue({
  el: '#mainCreate',
  data: {
    v_total : 0,
    test : [],
  },
});
function f_test(){
  var d = [
    {title : 'p1', price : 0},
    {title : 'p2', price : 2},
    {title : 'p3', price : 0},
    {title : 'p4', price : 4}
  ]

  $.each(d, function(index,date){
    Vue.set(app.test, index, date);
  });
}

function changeV(){
 app.v_total += 10;
}
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
  
<div id="mainCreate">
  v_total = {{ v_total}}
  <br>
    <span v-for="date in test">
      {{ date.title }}
      <input type="checkbox"
             name="featuresBox"
             v-bind:checked="date.price == 0"> date.price: {{ date.price }} - will not change when you mark the checkbox
      <br>
    </span>

    <button onClick="f_test()">create object</button>
    <button onClick="changeV()">change app.v_total</button>
</div>

When you change v_total it seems to reset the checkboxes because the change causes a re-render of the whole component.
It just resets the display of the checkboxes, it does not reset the values of the checkboxes, simply because their underlying data never changed.
Solution/Workaround: Add something to really change the data.prince when the checkboxes are checked, such as some code that executed on the change event, like:
<input ... v-on:change="date.price = (date.price ? 0 : 1)">

Fixed demo below.

const app = new Vue({
  el: '#mainCreate',
  data: {
    v_total : 0,
    test : [],
  },
});
function f_test(){
  var d = [
    {title : 'p1', price : 0},
    {title : 'p2', price : 2},
    {title : 'p3', price : 0},
    {title : 'p4', price : 4}
  ]

  $.each(d, function(index,date){
    Vue.set(app.test, index, date);
  });
}

function changeV(){
 app.v_total += 10;
}
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
  
<div id="mainCreate">
  v_total = {{ v_total}}
  <br>
    <span v-for="date in test">
      {{ date.title }}
      <input type="checkbox"
             name="featuresBox"
             v-on:change="date.price = (date.price ? 0 : 1)"
             v-bind:checked="date.price == 0"> date.price: {{ date.price }}
      <br>
    </span>

    <button onClick="f_test()">create object</button>
    <button onClick="changeV()">change app.v_total</button>
</div>

Note: I understand the snippet you gave is just a part of something bigger, but you really shouldn't mix jQuery and Vue. You should do all that changing inside the methods of a Vue instance. This will be much more maintainable in the long run.

