Vue.js 조회 작업 의 인 스 턴 스 상세 설명
인 스 턴 스 코드:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="../lib/vue.min.js" type="text/javascript" ></script>
<title> </title>
</head>
<body>
<div id="app">
：<input type="text" v-model="search" />
<table>
<tr>
<th> </th>
<th> </th>
<th> </th>
</tr>
<tr v-for='x in list'>
<td>{{x.name}}</td>
<td>{{x.price}}</td>
<td>{{x.num}}</td>
</tr>
</table>
</div>
<script type="text/javascript">
var vm=new Vue({
el:'#app',
data:{
/* */
info:[],
/* */
search:''
},
/*computed methods ， */
computed:{
list:function(){
var arr =[];
for(var i=0;i<this.info.length;i++){
if(this.info[i].name.indexOf(this.search)!=-1){
arr.push(this.info[i])
}
}
return arr;
}
}
})
for(var i = 1;i<20;i++){
vm.info.push({name:' '+i,price:1000*i,num:i})
}
</script>
</body>
</html>
보충:
이상 은 Vue.js 가 조회 작업 을 하 는 사례 에 대한 상세 한 설명 입 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남기 거나 본 사이트 지역사회 에 가서 토론 을 하 십시오.읽 어 주 셔 서 감사합니다. 여러분 께 도움 이 되 기 를 바 랍 니 다.본 사이트 에 대한 지지 에 감 사 드 립 니 다!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
LaravelAPI + Nuxt로 MultiAuth 구현현재 SIer5년째로 javascript(Jquery만), PHP(프레임워크 없음)를 2년 정도, C#(Windows 앱) 3년 정도 왔습니다. 여러가지 인연이 있어, 개인으로 최근 웹 서비스의 시작을 하게 되었습니...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
