nuxt.jsおよびvue.jsvuetifyの「選択」ドロップダウンリストの使用方法

debugcn 投稿 Dev

user12380208

フォームでnuxt.jsを使用していますが、「選択」ドロップダウンリストをvuetifyしていますが、このエラーを修正する方法がドロップダウンアイテムに表示されません。

<v-col class="d-flex" cols="12" sm="6" >
    <v-select :items="items" v-model.trim="form.city" label="Outlined style" outlined ></v-select>
</v-col>
<v-col cols="12" sm="12">

{{errors.GSTIN [0]}} <v-file-input v-model = "form.shop_front_image" type = "file" label = "shop_front_image"アウトラインオートコンプリート= "off" @ change = "handleFile（）" id = "file"> {{errors.shop_front_image [0]}}

<script scoped>
  export default {
     
    data() {
      return {
        form: {
          city:'',
          GSTIN: '',
          shop_front_image:'',
        }
      }
    },
    methods: {
      handleFile() {
        let input = document.getElementById("file")
        console.log(input)
        this.form.shop_front_image = input.files[0]
       
      },
      async submit() {
    
        let formData = new FormData(); 
        
        formData.append('city', this.form.city)
        formData.append('GSTIN', this.form.GSTIN)
        formData.append('shop_front_image', this.form.shop_front_image)
     
        console.log(formData)
     
        let rsp = await this.$axios.$post('/Businessregister', formData, {
          headers: {
            'Content-Type':'multipart/form-data'
          }
        })
        console.log(rsp.response)
      }
   
      }
    }

</script>

<script>
  export default {
    data: () => ({
      items: ['Mumbai', 'Delhi', 'Bangalore'],
    }),
  }
</script>

モーセン

転送items最初に2番目のスクリプトタグから、第二削除scriptのタグを

<script>
  export default {
     
    data() {
      return {
        items: ['Mumbai', 'Delhi', 'Bangalore'],
        form: {
          city:'',
          GSTIN: '',
          shop_front_image:'',
        }
      }
    },
    methods: {
      handleFile() {
        let input = document.getElementById("file")
        console.log(input)
        this.form.shop_front_image = input.files[0]
       
      },
      async submit() {
    
        let formData = new FormData(); 
        
        formData.append('city', this.form.city)
        formData.append('GSTIN', this.form.GSTIN)
        formData.append('shop_front_image', this.form.shop_front_image)
     
        console.log(formData)
     
        let rsp = await this.$axios.$post('/Businessregister', formData, {
          headers: {
            'Content-Type':'multipart/form-data'
          }
        })
        console.log(rsp.response)
      }
   
      }
    }

</script>
<style scoped>

<style>

scoped属性はstyleタグ用です。

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]