计算出的更改中的打印项目,没有重复项

时间:2019-02-22 10:36:29

标签: javascript html vue.js

每当项目列表更改时,我都试图在表中显示项目。我有一个函数和一个计算式,但是我不确定我是否做对了。

Function(){
    Every time a new value comes in: changeList.push(item);
}

然后我计算了一下

Computed:
    changedData: function(){
        return this.changeList;
    }

HTML

<tr v-for="change in changedData">
    <td>change.value</td>
<tr>

它确实会在更改时打印出列表中的每个项目,但是我不希望它打印出已经打印出的项目,而只是打印新项目。

编辑:发现了问题(推送功能)

for(index in question.Answers){
    if(question.Answers[index].Selected === "selected" &&
     question.Answers[index].Value === savedQuestion.Value){
        this.myList.push({newValue: question.Answers[index].Value, oldValue: 
        savedQuestion.Value}); 
    }
   }

这将添加所有问题及其值,无论列表中是否已经包含具有完全相同值的相同问题。

2 个答案:

答案 0 :(得分:1)

实际上不需要计算代码。这是在运行时将动态值添加到列表中的基本示例。

https://codepen.io/anon/pen/LqKjMM?editors=1111

模板代码=>

<script src="//vuejs.org/js/vue.js"></script>

<h1>Example of managing a Vue.js list</h1>

<div id="products">
  <vue-products></vue-products>
</div>

<script type="text/template" id='vue-products-template'>
  <div>
  <form v-on:submit.prevent="addProduct">
    <input type="text" v-model="productName">
    <input type="submit" value="Add"></input>
  </form>

  <ul>
    <li v-for="name in productNames">{{name}}</li>
  </ul>
  </div>
</script>

脚本代码=>

Vue.component('vue-products', {
  template: '#vue-products-template',
  data: function() {
    return {
      productName: "",
      productNames: ['booze', 'tums', 'peas', 'short wave radio'],
    }
  },
  methods: {
    addProduct: function() {
      this.productNames.push(this.productName)
      this.productName = ""
    }
  }
})

$(function() {
  new Vue({el: '#products', data: {}})
});

答案 1 :(得分:1)

因此,您可以在数组中检查是否存在具有相同值的对象。如果不是,则仅按值即可。

下面是更新的代码。

app = Flask(__name__)
#cors = CORS(app)
cors = CORS(app, resources={r"/foo": {"origins": "http://localhost:port"}})

app.config['CORS_HEADERS'] = 'Content-Type'

@app.route('/autocomplete', methods=['GET']) 
@cross_origin(origin='localhost',headers=['Content- Type','Authorization'])
def AutoComplete():

    data = request.args.get('input')
    print (data)

    #http://192.168.0.128:5000/autocomplete=?input=mumbai

    spellchecker = SpellChecker()
    tokens = spellchecker.correct_phrase(data)
    result = AutoCompleter().guess_exercises(tokens)

    return result[:10]


if __name__ == '__main__':
    app.run(host='192.168.0.128', port=5000)