집 > 기사 > 웹 프론트엔드 > vue.js에서 select의 값을 얻는 방법(자세한 튜토리얼)

vue.js에서 select의 값을 얻는 방법(자세한 튜토리얼)

亚连원래의: 2018-06-02 10:17:318168검색

이제 select에서 값 인스턴스를 얻을 수 있는 vue.js에 대한 기사를 공유하겠습니다. 이는 좋은 참조 값을 가지고 있으며 모든 사람에게 도움이 되기를 바랍니다.

아래와 같이:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="./vue.js"></script>
</head>
<body>
<label id="app">
<select v-model="selected" >
 <option v-for="option in options" v-bind:value="option.value">
 {{ option.text }}
 </option>
</select>
<span>Selected: {{ selected }}</span>
</label>
<script>
new Vue({
 el: &#39;#app&#39;,
 data: {
 selected: &#39;A&#39;,
 options: [
  { text: &#39;One&#39;, value: &#39;A&#39; },
  { text: &#39;Two&#39;, value: &#39;B&#39; },
  { text: &#39;Three&#39;, value: &#39;C&#39; }
 ]
 }
})
</script>
</body>
</html>

위 내용은 제가 모두를 위해 정리한 내용입니다. 앞으로 모든 분들께 도움이 되기를 바랍니다.

Vue에서 컴포넌트 외부를 클릭하여 컴포넌트를 닫는 방법에 대해(상세 튜토리얼)

Vue를 사용한 라우팅 권한 관리 문제(상세 튜토리얼)

vue.js 사용에 대해 태그 속성에 변수 매개변수를 삽입하는 방법(자세한 튜토리얼)

위 내용은 vue.js에서 select의 값을 얻는 방법(자세한 튜토리얼)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명：

이전 기사：Vue 사용자 정의 필터를 사용하는 방법다음 기사：Vue 사용자 정의 필터를 사용하는 방법