位置: IT常识 - 正文
Vue3 项目中使用setup()函数报错，script setup cannot contain ES module exports(vue3使用教程)
发布时间：2024-01-15推荐整理分享Vue3 项目中使用setup()函数报错，script setup cannot contain ES module exports(vue3使用教程)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vue3.0用法,vue在项目中怎么用的,vue3.0用法,vue3.0用法,vue项目使用rem,vue3使用jsx,vue3怎么用,vue项目使用rem,内容如对您有帮助，希望把文章链接给更多的朋友！
当使用vue3+vite使用语法糖setup时，要注意写法.
第一种写法就是<script> 标签里面配置 setup，另一种是：export default 类里配置 setup() 方法，
我们只需要使用一种方法即可，混用了就会报错了。
解决： 第一种
<script setup>
import {ref} from 'vue'
import { Toast } from 'vant';
import Index from '../pages/Index.vue'
import Team from '../pages/Team.vue'
const onClickLeft = () => alert(1);
const onClickRight = () => alert(2);
const active = ref('index');
const onChange = (index) => Toast(`标签 ${index}`);
</script>
第二种：
<script>
import {ref} from 'vue'
import { Toast } from 'vant';
import Index from '../pages/Index.vue'
import Team from '../pages/Team.vue'
export default {
name: 'BasicLayout',
setup() {
const onClickLeft = () => alert(1);
const onClickRight = () => alert(2);
const active = ref('index');
const onChange = (index) => Toast(`标签 ${index}`);
return {
onClickLeft,
onClickRight,
onChange,
active
};
}
};
下一篇：vue通过url方式展示PDF方法总结(vue通过url访问单个页面)
