【发布时间】:2017-06-19 09:09:35
【问题描述】:
如果有以下呈现列表的方法,如果我单击其中一个列表项,则列表消失。 还添加了 showdetal() 方法。
如何实现列表不消失?
data: function () {
return {
show: false,
query: '',
results: [],
resultdetail: [].....
methods: {
autoComplete: function () {
this.results = [];
if (this.query.length > 1) {
axios.get('/getproductjson/' + this.query + '/0')
.then(function (response) {
this.results = response.data
}.bind(this))
.catch(function (error) {
console.log(error);
});.....
showDetail: function (productId) {
this.results = [];
if (productId > 0) {
this.show = true;
this.resultdetail = [];
axios.get('/getproductjson/loremipsumdipsum/'+productId)
.then(function (response) {
this.resultdetail = response.data
}.bind(this.resultdetail))..
<template id="autocomplete">
<div>
<div class="col">
<section class="box clr1">
<header>
<h1>Product zoeken</h1>
</header>
<div>
<div>
<input type="text" placeholder="Welk product zoekt U?" v-model="query" v-on:keyup="autoComplete"
class="form-control">
<div class="panel-footer" v-if="results.length">
<ul>
<li style="list-style-type: none;padding:10px 0;" class="list-group-item" v-for="result in results">
<span style="text-decoration: underline;cursor:pointer" v-on:click="showDetail(result.id)">@{{ result.title }}</span>
</li>
</ul>....
</div>
</template>
【问题讨论】:
-
显示你的
showDetail(result.id)方法 -
添加了 showDetail @wostex
-
在
showDetail()中,您正在使用this.results = [];清除结果