问题标签 [vuejs3]

虽然Vue Composition API RFC Reference 站点有很多watch模块的高级使用场景，但没有关于如何观看组件道具的示例？

Vue Composition API RFC 的主页或Github 的 vuejs/composition-api 中也没有提到它。

我创建了一个Codesandbox来详细说明这个问题。

编辑：虽然我的问题和代码示例最初是使用 JavaScript，但我实际上使用的是 TypeScript。托尼汤姆的第一个答案虽然有效，但会导致类型错误。Michal Levý的回答解决了这个问题。所以我typescript后来标记了这个问题。

EDIT2<b-form-select> ：这是我在from之上的这个自定义选择组件的反应性布线的抛光但准系统版本bootstrap-vue （否则不可知论实现，但这个底层组件确实会发出 @input 和 @change 事件，这取决于是否以编程方式进行更改或通过用户交互）。

我正在尝试将@vue/apollo-composable与我的 Nuxt-Ts 应用程序一起使用。这是应该如何将其注入“普通”Vue 应用程序的根实例的示例：

问题：我不知道如何访问Nuxt-TS 中的根实例。

我尝试制作一个插件，但它被直接注入到根实例中（这是不对的，因为@vue/apollo-composable使用composition-api::provide()它会创建它自己的属性_provided。

如果我使用 nuxt 插件的inject一个$get 连接。如果我_provided直接通过它写一个对象，ctx.app._provided =它就不会粘住。

我不能provide()像原来的例子那样调用，因为它只允许在VueComponent::setup函数内部。

我还尝试创建一个组件并在我需要它的页面上使用它（虽然有点违背了在根实例中安装的目的）

但是随后setup导出的组件在InstallGraphQl::setup...之前被调用

编辑：有关更多信息，@vue/apollo-composable请参见此处的讨论：https ://github.com/vuejs/vue-apollo/issues/687

您如何看待 Vue 3（或 composition-api）中的模板渲染，尤其是它的速度和轻量级？

我们创建了一个带有简单组件的站点构造函数（例如 ui-box、ui-button 等）。在 Vue 2 中，对于其中的大多数，我们使用功能组件通过 h() 函数进行渲染，以便进行渲染更快更轻，因为我们期望在场景中有很多这样的组件。据我所知，在 Vue 3 中，模板渲染会更快并具有更好的性能。

你怎么看？当 Vue 3 到来时，我们应该仍然使用 h() 还是可以使用通常的模板渲染？

我的子组件中有一个表单：

现在从我的父组件中，我有一个按钮，我需要单击该按钮来获取子表单数据。

感谢你的帮助。

如何配置vue-apollo, 结合使用or@vue/apollo-composable来完善？@vue/composition-apiVue3.0

因为虽然我apolloClient通过 using获得了默认值@nuxtjs/apollo：

它仍然是空的，而不是填充我的设置nuxt.config.ts。

我怎样才能创建一个工作vue-apollo client使用@vue/apollo-composable或如何context.root.$apollo在第一手创建？

我在使用 Axios 在 Vue 中上传多个文件时遇到了一些问题。问题是 FileList 总是返回一个长度0，即使我选择了多个文件。

我有一个打开文件上传的按钮：

它调用的函数：

它所指的表单输入：

然后在handleUpload()我想axios打电话上传文件。

但this.files总是返回一个FileList长度为0. 我已经file在函数中设置了数据：

这里我有两个组件：

消息.vue

样本.vue

最后，

应用程序.vue

我想做的事情是用msg组件我想改变msgApp.vue的数据中的组件。但是当我更改值时，Vue 会发出警告：

所以我不明白下一步该怎么做。请帮助我。

我正在使用 api 渲染一个 Json

这给了我如下的Json数据

我在我的模板中呈现数据如下

输出如我所料。有人可以建议我吗，如何编写一个方法以便整理我的输出取决于“创建”时间戳

每次我通过使用类似这样的路由器对象推送组件来渲染组件时，我都在努力使其正常this.$router.push('/Home/mypath');工作为索引。基本上，我将索引值传递给输入文本元素的ref ，该元素位于组件的v-for循环内，所以在mounted()，我有这样的东西

但即使我传递了 1 或 2 的值，它仍然专注于第一个输入元素。当我查看控制台日志时，它会在控制台上显示此错误。 TypeError：无法读取 此行上未定义指向的属性“0”this.$refs.newInp[index].focus();

获取 v-for 中数据的示例代码

模板：

如何解决此类问题？解决方案是什么？谢谢。

我只是尝试使用 Vuetify 在 Nuxt/Composition API/TypeScript 项目中使用子组件。我尝试在 setup 方法之前包含组件，但是当我查看源代码时，我只看到<!---->子组件数据应该在哪里。

这是应该显示“嵌套”组件的layouts/default.vue布局。

这是要嵌套的components/ListFilter.vue组件的示例内容，其中的内容无关紧要。