1

我有一个用于从数组中计算硬币数量的代码，此代码允许我了解我可以从给定订单的表中购买多少，代码 orderSize 正在变异以达到结果，但是当我放置一个输入区域进行手动输入时突变导致输入文本更改的 ordersize（如果它高于第一项数量），我不希望文本更改。我尝试添加另一个等于 orderSize 的变量，但同样的事情发生了。我应该怎么做才能防止输入文本发生变异。（尝试输入任何高于 100 的值，文本会改变）（数组来自我无法控制的外包）（如果我不改变那个变量，我的主要目标计算硬币数量就无法完成）

jsfiddle

new Vue({
  el: '#app',
  data: {
    orderSize : null,
  },
  computed: {
    calculateOrder () {
      var coinArray = [["100","1"],["200","2"],["300","3"],["400","4"], 
      ["500","5"],["600","6"]] ;
      var sum = 0
      var sum1 = 0
      var i= 0
      
      for (i = 0; i < coinArray.length; i++){
        if (coinArray[i][0]*coinArray[i][1] < this.orderSize) {
          sum1 += parseFloat(coinArray[i][1]);
          sum += coinArray[i][0]*coinArray[i][1];
          this.orderSize -= coinArray[i][0]*coinArray[i][1] ;        
        } else {
          return sum1+this.orderSize/parseFloat(coinArray[i][0]);
        }
      }
    },
  },
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
  <div id="app">
    <input v-model="orderSize" placeholder="Order $">
  <p>{{ calculateOrder }}</p>
</div>

4

1 回答 1

0

如果我没看错，问题是您正在orderSize使用进行修改-=，这将显示在输入中。

如果你想避免这种情况，那么首先将 的值复制orderSize到一个新变量中，例如：

// Copy the variable
let size = this.orderSize
for (...){
  if (...) {
    size -= coinArray[i][0]*coinArray[i][1];
  } else {
     return sum1+size/parseFloat(coinArray[i][0]);
  }

（为了清楚起见，我删除了不相关的代码和if/for的内容）。

于 2019-03-04T20:41:17.183 回答