mix.html

<script src="http://cdn.bootcss.com/vue/2.0.0-rc.7/vue.min.js"></script>
<div id="app">
<div class="form-horizontal">
<div class="form-group hidden-xs">
<div class="col-sm-2">&nbsp;</div>

<div class="col-sm-3">含量</div>

<div class="col-sm-3">重量</div>
</div>

<div class="form-group"><label class="col-sm-2 control-label" for="">目标</label>

<div class="col-sm-3"><input class="form-control" placeholder="含量" type="number" v-model="percent" /></div>

<div class="col-sm-3"><input class="form-control" placeholder="重量" type="number" v-model="quantity" /></div>
</div>

<div class="form-group"><label class="col-sm-2 control-label" for="">物料1</label>

<div class="col-sm-3"><input class="form-control" placeholder="含量" type="number" v-model="percent_1" /></div>

<div class="col-sm-3"><input class="form-control" placeholder="重量" readonly="readonly" type="number" v-model="quantity_1" /></div>
</div>

<div class="form-group"><label class="col-sm-2 control-label" for="">物料2</label>

<div class="col-sm-3"><input class="form-control" placeholder="含量" type="number" v-model="percent_2" /></div>

<div class="col-sm-3"><input class="form-control" placeholder="重量" readonly="readonly" type="number" v-model="quantity_2" /></div>
</div>

<hr />
<p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 注：如果物料2是糊精，含量参数请输入 0 .</p>
</div>
</div>
<script>
new Vue({
  el: '#app',
  data: {
    percent: 80,
    quantity: 1000,

    percent_1: 90,
    percent_2: 20,
  },
  computed: {
    quantity_1: function () {
      return (this.percent * this.quantity - this.percent_2 * this.quantity) / (this.percent_1 - this.percent_2);
    },
    quantity_2: function () {
      return this.quantity - this.quantity_1;
    }
  }
});
</script>