帮忙看看 Vue 的问题

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

这是一个创建于 862 天前的主题，其中的信息可能已经有所发展或是发生改变。

环境 vite + vue3 + element plus, 组件中的两端 script 代码，这两处 setup 看日志有一处没有运行，是正常的吗，app 引用的时候提示找不到 "form"

App.vue

<script setup>
	import moment from 'moment/min/moment-with-locales'
    import { ref, reactive, toRefs, toRef } from 'vue'
    console.log("setup from setup");
</script>


<script>
    import { reactive, toRefs } from 'vue';
    export default {
        setup() {
            console.log("setup from default");
            const state = reactive({
                form: {
                    userName: '',
                    newPass: '',
                }
            });
            return {
                ...toRefs(state),
            }
        },
</script>

7 条回复 • 2021-12-14 16:28:01 +08:00

vacnt7

2021-12-13 22:34:58 +08:00

return 里面直接 return state 就好了，不是很清楚为什么还要再去 refs 一次 state ，上面的 reactive 已经将 form 初始化为响应式变量了

chengxy

2021-12-13 22:52:48 +08:00

@vacnt7 #1 估计是要解构，不想使用 state.form 的方式。

dengshen

2021-12-14 00:12:06 +08:00 via iPhone

默认导出覆盖 setup 了

gouflv

2021-12-14 06:06:59 +08:00 via iPhone

vue3 的代码风格一言难尽

kensoz

2021-12-14 07:51:06 +08:00

单文件组件<script setup>与普通的 script 一起使用
https://v3.cn.vuejs.org/api/sfc-script-setup.html#%E4%B8%8E%E6%99%AE%E9%80%9A%E7%9A%84-script-%E4%B8%80%E8%B5%B7%E4%BD%BF%E7%94%A8

longkas239

2021-12-14 10:09:02 +08:00 via Android

这个问题是解决了，但是后面遇到了诡异的其他 bug ，官方说两种 script 可以混用，但是 antd 和 elementplus 都不建议使用，我提 bug 到 vite 然后转到 element 再转到 vue ，对于使用者根本不知道问题会出现在哪一端，而且开发模式正常只有打包部署出问题，调试完这个程序我是不想碰前端项目或者考虑换个扎实点的前端框架了

tolking

2021-12-14 16:28:01 +08:00

总有人不看文档.jpg