>  기사  >  웹 프론트엔드  >  IView의 on-change 속성 사용에 따른 자세한 설명

IView의 on-change 속성 사용에 따른 자세한 설명

亚连
亚连원래의
2018-05-30 10:47:344551검색

아래에서는 IView의 on-change 속성 사용에 대한 자세한 설명을 공유하겠습니다. 이는 좋은 참고 가치가 있으며 모든 사람에게 도움이 되기를 바랍니다.

저는 업무상 백엔드와 프론트엔드 코드도 다루면서 입력 태그의 onchange 때문에 고민을 했습니다. 더 이상 고민하지 말고 다음에 무슨 일이 일어났는지 말씀드리겠습니다.

문제가 발생했습니다

저는 이전에 동료들과 함께 지방 및 지방자치단체 수준의 3단계 연결의 작은 기능을 구현하는 vue의 멋진 프레임워크를 연구했습니다.

<Form-item label="所在地区" >
   <Row >
   <Col span="12">
   <select v-model="f.p" @change="selpro" placeholder="sheng">
    <option :value="i" v-for="(v,i) in pro">{{v.name}}</option>
   </select>
   </Col>
   <Col span="12">
   <select v-model="f.c" @change="selcity" placeholder="shi">
    <option :value="i" v-for="(v,i) in city">{{v.name}}</option>
   </select>
   </Col>
   <Col span="12">
   <select v-model="f.cc" v-show="county.length>0" @change="result" placeholder="xian"> 
    <option :value="i" v-for="(v,i) in county">{{v.name}}</option>
   </select>
   </Col>
   </Row>
  </Form-item>
.

for front-end 인터페이스 vue를 작성한 후 프론트엔드와 백엔드 코드를 동일한 프로젝트로 병합할 때 js와 html 코드 사양과 vue 간의 불일치로 인해 onchange와 같은 다양한 문제가 발생했습니다. ="", @change="" in iview 작동하지 않았습니다. 결국 강력한 검색엔진인 Google을 통해 문제가 해결되었습니다.

문제를 해결했습니다.

iview에 쓰는 올바른 방법. @on-change

<Form-item label="所在地区">
    <Row>
     <i-col span="12">
      <i-select v-model="f.p" @on-change="selpro" placeholder="sheng">
       <i-option :value="i" v-for="(v,i) in pro" :key="v.id">{{v.name}}</i-option>
      </i-select>
     </i-col>
     <i-col span="12">
      <i-select v-model="f.c" @on-change="selcity" placeholder="shi">
       <i-option :value="i" v-for="(v,i) in city" :key="v.id">{{v.name}}</i-option>
      </i-select>
     </i-col>
     <i-col span="12">
      <i-select v-model="f.cc" v-show="county.length>0" onchange="result" placeholder="xian">
       <i-option :value="i" v-for="(v,i) in county" :key="v.id">{{v.name}}</i-option>
      </i-select>
     </i-col>
    </Row>
   </Form-item>

위에서 모든 사람을 위해 정리했습니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

js+canvas는 슬라이딩 퍼즐 인증 코드 기능을 구현합니다.

배열이 아닌 객체를 배열로 변환하는 JS 방법 요약

Node 모듈에 대한 심층적인 이해

위 내용은 IView의 on-change 속성 사용에 따른 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.