본문 바로가기
IT일반/VueJS

Text Input 옆에 버튼 나란히

by xavi2019 2021. 4. 20.

html

<v-app id="app">

  <v-container>
  
    <v-text-field
      label="Label"
      color="primary"
      v-model="input"
      @keypress.enter="show">
  
       <template v-slot:append>
  
          <v-btn
            depressed 
            tile
            color="primary"
            class="ma-0"
            @click="show">
          
            show
            
          </v-btn>
        
      </template>
        
    </v-text-field>
      
  </v-container>
  
</v-app>

js

new Vue({
  
  el: "#app",

	vuetify: new Vuetify(),
  
  data: {

	input: ''

  },
  
  methods: {
  
    show(){

		alert(this.input)

    }
    
  }
  
})

'IT일반 > VueJS' 카테고리의 다른 글

Vuetify를 Firebase로 배포하기 설정  (0) 2021.04.01

댓글