Vue v-for 의 input 또는 select 값 이 바 뀌 었 을 때 이벤트 동작 을 실행 합 니 다.
<input type="text" id="myInput" oninput="myFunction()">
<script>
function myFunction() {
}
</script>
oninput Vue 에서 사용 하려 면 v-on:input 와 바 인 딩 id 로 써 야 할 때 이렇게 쓰 십시오:id="mnum'+index'주의 mnum 은 반드시 작은 따옴표 로 일 으 켜 야 한다.jsMoney 방법
jsMoney:function(index){
$("#m_num"+index).val()
}
onchange:input 의 텍스트 수정 후 input 에서 초점 을 잃 은 후 터치 합 니 다.onblur:input 초점 을 잃 은 후 바로 터치
oninput:input 텍스트 입력 시 터치
추가 지식:VUE 프로젝트 에 this.$forceUpdate()를 사용 합 니 다.페이지 v-for 에서 item 속성 값 을 수정 한 후 페이지 v-if 가 변경 되 지 않 는 문 제 를 해결 합 니 다.
페이지 디 스 플레이:
구현 효과:목록 내용 의 전개,접 기 를 누 르 십시오.
코드:
<div class="invoice-list" v-for="(item,index) in invoiceData" :key="index">
<div class="images"><img src="../../../../../static/images/invoice_pu.png" v-if="item.invoiceType == '0'"><img src="../../../../../static/images/invoice_zhuan.png" v-else-if="item.invoiceType == '1'"></div>
<div class="text">
<h3 v-if="item.invoiceType == '0'"> </h3>
<h3 v-else-if="item.invoiceType == '1'"> </h3>
<p><span> :</span>{{item.enterpriseName}}</p>
<p><span> :</span>{{item.dutyParagraph}}</p>
<transition name="fade">
<div class="zhuanInfo" v-if="item.mark == true">
<p><span> :</span>{{item.address}}</p>
<p><span> :</span>{{item.contactNumber}}</p>
<p><span> :</span>{{item.accountOpeningBank}}</p>
<p><span> :</span>{{item.bankAccount }}</p>
</div>
</transition>
<div class="zhuanMark" v-if="item.invoiceType == '1'">
<p class="hideMark">
<img src="../../../../../static/images/arrow_bottom.png" v-if="item.mark == false" @click="clickZhuanMark(index,$event)">
<img src="../../../../../static/images/arrow_top.png" v-else @click="clickZhuanMark(index,$event)">
</p>
</div>
<div class="list-radio"><input type="radio" value="" name="selectContact" @change="getInvoiceId(item.invoiceId)" /></div>
</div>
</div>
v-for 렌 더 링 목록 입 니 다.실행 목록 을 접 고 펼 칠 때"clickZhuanMark"JS 는 다음 과 같 습 니 다.
clickZhuanMark(val,event){
this.invoiceData[val].mark = !this.invoiceData[val].mark;
},
그러나 실제 적 으로 생각 했 던 것 처럼 효 과 를 실현 하지 못 하고 코드 를 수정 했다.이.$forceUpdate()를 추가 합 니 다.강제 렌 더 링 을 진행 하여 효과 가 실 현 됩 니 다.검색 자 료 를 통 해 결 과 를 얻 을 수 있 습 니 다.데이터 차원 이 너무 많 기 때문에 render 함수 가 자동 으로 업데이트 되 지 않 았 습 니 다.수 동 으로 강제로 새로 고침 해 야 합 니 다.
이 Vue v-for 의 input 또는 select 의 값 이 바 뀌 었 을 때 트리거 이벤트 작업 은 바로 작은 편집 이 여러분 에 게 공유 하 는 모든 내용 입 니 다.참고 하 시기 바 랍 니 다.많은 응원 부탁드립니다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Vue Render 함수로 DOM 노드 코드 인스턴스 만들기render에서createElement 함수를 사용하여 DOM 노드를 만드는 것은 직관적이지 않지만 일부 독립 구성 요소의 디자인에서 특수한 수요를 충족시킬 수 있습니다.간단한 렌더링 예는 다음과 같습니다. 또한 v...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.