问题标签 [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.
facebook - Facebook 页面插件未在 Vue Js 中加载
我在我的 Vuejs 应用程序中集成了 Facebook 页面插件。当我从一个组件移动到另一个组件并返回到包含 Facebook 页面的组件时,页面没有加载。它仅在第一次和每次加载完整站点时加载。有什么解决办法吗?
html - VueJS - 清理输出以防止跨站点脚本攻击
我是 VueJS 的新手。我开始学习 v-html 指令。我的问题是:如何清理输出以防止跨站点脚本攻击?
vue.js - 带有打字稿的 vue-class-component 语法
https://github.com/vuejs/vue-class-component上的示例(对于 vuejs3 中的新组件语法),但我使用的是直接类型脚本而不是 babel。因此,我尝试:
可惜,this.propMessage
找不到。我如何必须更改语法才能找到它?
javascript - 根据另一个数组Vuejs过滤数组
我有两个数组
我有一个使用 Vuejsproducts.name
进行渲染的选择下拉菜单。
例如,当我选择 时Jivi
,我想比较in和infrequency
中的数字以及它们匹配时,然后显示ofproducts
id
haufigkeit
name
haufigkeit
这是我正在尝试的
我已经尝试了两天,它给了我一个错误cannot read property 'every' of undefined
。谁能建议我在哪里做错了?
typescript - Convert Vuejs Typescript Options to Composition Api 中的奇怪问题
问题已解决,请通读问题,了解如何逐步解决问题
我阅读了有关组合 API(https://vue-composition-api-rfc.netlify.com/#api-introduction)的信息,并尝试转换我现有的基于 vuejs 中 Option api 上的打字稿的代码,但我未能让它工作,有点困惑组合 API 是如何工作的。
我的工作代码如下:
组合 api 中的转换版本低于未正常运行的版本:
其中 webstorm 显示 3 个错误:
有没有办法正确解决这个问题?
.....................
更新1:
我在使用道具时犯了错误(我以为我是新的 vue,它不需要类型,它会自动从父组件的 typescript 中获取它)。多亏了古问题,问题已经解决并得到解决。
感谢https://frontendsociety.com/using-a-typescript-interfaces-and-types-as-a-prop-type-in -vuejs-508ab3f83480 ,您可以将创建的类型接口作为如下函数传递:
但仍有一些问题需要解决,如下所示:
1.当我删除反应性时,反应性似乎无法正常工作,并且在模板中显示“未解析的变量或缺少导入语句”
…………………………………………………………………………………………
update2分享道具和使用合成功能:
对我来说,在将基于选项的 api 转换为组合 api 之后,它似乎比新的更好,这要归功于古和 Maximilian shrwazmuller(我强烈建议观看这个免费视频: https: //www.youtube.com/watch ?v=V-xK3sbc7xI),谷歌搜索与这个https://vue-composition-api-rfc.netlify.com/api.html#template-refs我重新编写代码如下:
如您所见,它非常简洁,因为将在组件之间共享的所有内容都在另一个文件中(名为:inputFiled.compositons),如下所示:
正如您所看到的,通过此功能,我们可以充分发挥打字稿的潜力。
最后我应该告诉你,如果你遵循路径并使用 vue-composition api,你的项目将完美运行,但 webstorm 会向你显示一些关于模板中特定代码的警告,比如未解析的变量。这些新的语法支持正在开发中,您可以在本期https://youtrack.jetbrains.com/issue/WEB-41565中看到, 所以不要担心并使用它。
vue.js - Vuejs在v-model为空时隐藏一个div
我有一个这样的选择下拉菜单。
我以这种方式呈现价值
The value of the {{Math.round(selectedInjection)}
changes when the select value changes and it's working fine. 但是当我不选择任何值时,{{Math.round(selectedInjection)}
除非我选择新值,否则会显示旧的选定值。How can I hid the {{Math.round(selectedInjection)}
when the select value is empty?
这是 Jsfiddle https://jsfiddle.net/ey3scra0/
javascript - Vue 3 组合 API 和对 Vue 实例的访问
在main.js
我有这样的事情:
通过这种方式,我可以访问myUtilFunc
整个应用程序this.$myUtilFunc
setup()
但是,如果我无法访问 Vue 3中的方法,我该如何实现this
呢?
vue.js - Vue 3 组合 API,如何在 setup() 函数中获取上下文父属性?
我遇到了 Vue 3 (alpha 4) 的问题:
在setup()
函数内部,我试图读取父组件。根据 https://vue-composition-api-rfc.netlify.com/api.html#setup上的文档,它应该通过context
参数公开父级,作为 context.attrs 的属性或直接作为父级(参见SetupContext
'打字'下的位)。我发现文档对于是否parent
应该直接从SetupContext
或 via访问不是很清楚SetupContext.attrs
,所以我尝试了两种方式,但无济于事。
这是我的问题,我可以在记录它们时访问SetupContext
and SetupContext.attrs
(这是一个代理)就好了。SetupContext.attrs
公开通常的代理属性(和) [[Handler]]
,并且在检查时清楚地显示父属性。[[Target]]
[[IsRevoked]]
[[Target]]
但是,当记录父级时,它只会打印出未定义的:
传播上下文会产生相同的结果:
我对 JavaScript 中的代理有点陌生,但是从我读到的关于它们的内容来看,以及从尝试响应 () 例如返回的代理。我应该能够像通常使用对象一样访问该属性。关于我做错了什么的任何想法?
我创建了一个代码框来重现问题
vuejs3 - VueJs 检测移动设备的方式,当我们需要渲染两个不同的视图时,相对于设备类型
我需要根据设备类型更改要在网格视图中显示的元素数量。对于移动视图和桌面视图。我经历了很多建议,比如
- 检查设备屏幕尺寸
- 检查设备类型
最后我最终检查了方法中的设备类型。
我使用 isMobile() 方法为每个设备定义我的条件。我的问题是如何将此 isMobile() 方法用作计算属性,因为我只返回一个布尔值。并且可以在没有均匀监听器的情况下像这样使用。因为它到目前为止工作正常。但是我正在寻找一个更统一的解决方案,因为我是 VueJs 的新手。提前致谢。