问题标签 [vuejs3]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 如何使用 Vue Composition API / Vue 3 观察道具变化?
虽然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 事件,这取决于是否以编程方式进行更改或通过用户交互)。
typescript - 如何使用 nuxt 和 @vue/composition-api 提供/注入 Vue 根实例?
我正在尝试将@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.js - Vue 3 中的模板渲染与渲染函数 h()
您如何看待 Vue 3(或 composition-api)中的模板渲染,尤其是它的速度和轻量级?
我们创建了一个带有简单组件的站点构造函数(例如 ui-box、ui-button 等)。在 Vue 2 中,对于其中的大多数,我们使用功能组件通过 h() 函数进行渲染,以便进行渲染更快更轻,因为我们期望在场景中有很多这样的组件。据我所知,在 Vue 3 中,模板渲染会更快并具有更好的性能。
你怎么看?当 Vue 3 到来时,我们应该仍然使用 h() 还是可以使用通常的模板渲染?
vue.js - VueJs 从父组件获取子表单数据
我的子组件中有一个表单:
现在从我的父组件中,我有一个按钮,我需要单击该按钮来获取子表单数据。
感谢你的帮助。
vue.js - 如何使用 @vue/composition-api 和 nuxt.js 获取 vue-apollo 实例
如何配置vue-apollo
, 结合使用or@vue/apollo-composable
来完善?@vue/composition-api
Vue3.0
因为虽然我apolloClient
通过 using获得了默认值@nuxtjs/apollo
:
它仍然是空的,而不是填充我的设置nuxt.config.ts
。
我怎样才能创建一个工作vue-apollo
client
使用@vue/apollo-composable
或如何context.root.$apollo
在第一手创建?
vue.js - 使用 Vue 和 Axios 上传多个文件
我在使用 Axios 在 Vue 中上传多个文件时遇到了一些问题。问题是 FileList 总是返回一个长度0
,即使我选择了多个文件。
我有一个打开文件上传的按钮:
它调用的函数:
它所指的表单输入:
然后在handleUpload()
我想axios
打电话上传文件。
但this.files
总是返回一个FileList
长度为0
. 我已经file
在函数中设置了数据:
javascript - 根据Vuejs中的时间戳对Json数据进行排序
我正在使用 api 渲染一个 Json
这给了我如下的Json数据
我在我的模板中呈现数据如下
输出如我所料。有人可以建议我吗,如何编写一个方法以便整理我的输出取决于“创建”时间戳
javascript - 渲染组件后如何关注特定的输入文本?
每次我通过使用类似这样的路由器对象推送组件来渲染组件时,我都在努力使其正常this.$router.push('/Home/mypath');
工作为索引。基本上,我将索引值传递给输入文本元素的ref ,该元素位于组件的v-for循环内,所以在mounted()
,我有这样的东西
但即使我传递了 1 或 2 的值,它仍然专注于第一个输入元素。当我查看控制台日志时,它会在控制台上显示此错误。
TypeError:无法读取
此行上未定义指向的属性“0”this.$refs.newInp[index].focus();
获取 v-for 中数据的示例代码
模板:
如何解决此类问题?解决方案是什么?谢谢。
vue.js - Vue Composition API createComponent 子组件
我只是尝试使用 Vuetify 在 Nuxt/Composition API/TypeScript 项目中使用子组件。我尝试在 setup 方法之前包含组件,但是当我查看源代码时,我只看到<!---->
子组件数据应该在哪里。
这是应该显示“嵌套”组件的layouts/default.vue布局。
这是要嵌套的components/ListFilter.vue组件的示例内容,其中的内容无关紧要。