vue3 setup script

Question

老师 你好 这个stringField.vue文件中也没有content呢，怎么运行就报这个错了呢，不是很理解了？？？

Answer 1

frankin329 2021-12-22 18:15:30

<template>
  <input type="text" :value="value" @input="handleChange" />
</template>

<script setup>
import { defineProps } from 'vue'
import { FiledPropsDefine } from '../types'
const props = defineProps(FiledPropsDefine)

function handleChange(e: any) {
  console.log(e)
  props.onChange(e.target.value)
}
</script>

<style></style>

setup的新写法可以参考下

TRANSLATE with x

English

Arabic	Hebrew	Polish
Bulgarian	Hindi	Portuguese
Catalan	Hmong Daw	Romanian
Chinese Simplified	Hungarian	Russian
Chinese Traditional	Indonesian	Slovak
Czech	Italian	Slovenian
Danish	Japanese	Spanish
Dutch	Klingon	Swedish
English	Korean	Thai
Estonian	Latvian	Turkish
Finnish	Lithuanian	Ukrainian
French	Malay	Urdu
German	Maltese	Vietnamese
Greek	Norwegian	Welsh
Haitian Creole	Persian

 

TRANSLATE with

COPY THE URL BELOW

Back

EMBED THE SNIPPET BELOW IN YOUR SITE

Enable collaborative features and customize widget: Bing Webmaster Portal

Back

Answer 2

frankin329 2021-12-22 18:11:54

<template>
  <input type="text" :value="value" @input="handleChange" />
</template>

<script setup>
import { defineProps } from 'vue'
import { FiledPropsDefine } from '../types'
const props = defineProps(FiledPropsDefine)

function handleChange(e: any) {
  console.log(e)
  props.onChange(e.target.value)
}
</script>

<style></style>
setup新写法可以参考下

新的setup写法可以参考下

Answer 3

慕仰5486833 2021-10-17 10:01:09

<template>
  <input type="text" @input="handleChange" />
</template>

<script>
import { FiledPropsDefine } from '../types'

export default {
  name: 'StringField',
  props: FiledPropsDefine,
  methods: {
    handleChange(e) {
      console.log(e)
      this.onChange(e.target.value)
    },
  },
}
</script>

改成了普通vue文件

Answer 4

Jokcy 2021-06-24 19:51:35

这应该是是SFC setup语法的bug，这个语法到现在也没有定稿，说实话不推荐用，官网也没有正式文档。课程里面更多是为了介绍一下，如果实在不行就改成普通的vue吧