Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Vue组合api -使用组件道具的全局状态可组合

Vue组合api -使用组件道具的全局状态可组合
EN

Stack Overflow用户
提问于 2022-07-26 02:46:27
回答 1查看 221关注 0票数 0

在我的应用程序中有一个可组合的名为useLocalization的程序。它提供基于用户语言首选项的翻译字符串,并在整个应用程序中使用。

问题是,可以配置useLocalization并接受以下参数,但我不知道将这些参数从根组件传递到可组合的最佳方式是什么:

代码语言:javascript
运行
AI代码解释
复制
 interface ILocalizationProps {
    currentLocale: Ref<string>
    fallbackLocale: Ref<string>
    locales: Ref<Partial<ILocale>[]>
  }

使用useLocalization的根组件接受与props相同的参数,因此消费应用程序可以配置/重写所使用的语言。

代码语言:javascript
运行
AI代码解释
复制
const DEFAULT_LANG = 'en'
export const withLocalizationProps = () => ({
    currentLocale: { type: String, default: null },
    fallbackLocale: { type: String, default: DEFAULT_LANG },
    locales: { type: Array as () => Partial<ILocale>[], default: () => [] },
})

如何使用传递给根组件的支持来初始化可组合的?以下是我发现的问题:

  1. useLocalization(props)在这里不起作用,因为组件树中没有更深层次的道具。
  2. 使用provide/inject,我可以在provide部件中使用props,并获得正确配置的inject版本,但这阻止了我在根组件中使用useLocalization,因为注入不可用。
  3. 使用黑客解决方案,如在vee-验证/ injectWithSelf中。即使如此,可组合的签名将是useLocalization(props?: IProps),我的根组件必须是第一个用道具调用此函数的组件。
  4. 使用像createInjectionState这样的助手,但问题与2相同。

有什么最好的办法解决这个问题吗?不依赖于组件状态(如useMouse )的可组合性很好,但是(全局)可配置的可组合性导致了上述问题:(

EN

回答 1

Stack Overflow用户

发布于 2022-08-03 01:58:40

在这种情况下,与其使用道具,不如使用提供/注入。

这是推荐信。https://vuejs.org/guide/components/provide-inject.html

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/73121991

复制
相关文章
css 边框重合加边框双向展开实现
如果要实现这种效果,高亮边框就不能使用border属性来实现了。 这里我的思路是将高亮边框用div实现代码如下
切图仔
2022/09/14
2.8K0
CSS多边框的几种实现方法
css3中我们知道可以使用box-shadow属性轻松的为元素添加阴影效果,并且可以设置多组效果,每组参数值用逗号隔开。如果把box-shadow特性的两个偏移量 h-shadow 、v-shadow设置为0,将模糊值blur也设置为0,此时增加扩张半径,就会使元素的投影变为实线边框。这样就可以模拟多边框效果了,首先看下box-shadow语法和参数。
javascript.shop
2019/09/04
2K0
CSS多边框的几种实现方法
使用css3来实现边框圆角效果
经常看到别人的网站有个边框来修饰文字区域,类似圆角矩形把文字环绕起来,特别有感觉,于是就试着用图片边框来修饰,但是用图片过多会拉慢网页的加载速度,能不能使用css3来实现边框圆角效果呢?当然border-radius要在firefox或Safari 和 Chrome才能实现
ytkah
2022/03/14
1K0
使用css3来实现边框圆角效果
CSS边框
border-方向:width style color(border对应分别是宽度 样式 颜色中间空格隔开。)
十月梦想
2018/08/29
3.3K0
CSS——边框
定义 边框(Border)属性是对HTML元素的边框进行定义的CSS属性。 概述 通过边框的样式设置,给元素增加更丰富的外观 边框的设置包含以下内容: 边框的类型 边框的尺寸 边框的前景背景 圆角边框 列表 元素 描述 border border 属性是规定各种单独的边界属性的简写属性,可用于设置一个或多个以下属性的值:border-width,border-style,border-color。 border-bottom border-bottom 该属性是用来将下边框的所有属性:border-bott
Html5知典
2019/11/26
4K0
CSS实现多重边框的5种方式
目前最优雅地实现多重边框的方案是利用CSS3 的 box-shadow属性,但如果要兼容老的浏览器,则需要选择其他的方案。本文简要地列举了几种多重边框的实现方案,大家可以根据项目实际及兼容性要求等情况,选择最适合的实现方案。
Javanx
2019/09/04
1.4K0
CSS实现多重边框的5种方式
CSS3实现多样的边框效果
半透明边框 实现效果: 实现代码: <div> 你能看到半透明的边框吗? </div> div { /* 关键代码 */ border: 10px solid rgba(255,25
laixiangran
2018/07/25
9930
CSS3实现多样的边框效果
css边框的秘密
核心:除了样式不可以省略.其他的都可以,但是如果颜色省略了就是默认的黑色。宽度大小如果省略了就是medium;。 编写的顺序:边框的宽度 边框的样式 边框的颜色
贵哥的编程之路
2020/10/28
2.2K0
css边框的秘密
CSS实现最简洁的四角边框
在前端有一句古话,叫能用CSS实现的就别麻烦JS,因为声明式的配置语言CSS相比于自由式的编程语言JS,更容易被编译器所优化,比如css渲染引擎会优先考虑gpu加速,因此CSS动画的性能往往高于JS动画,本文介绍在不需要html和js的配合的情况下,用纯css实现一个好看的四角边框。
Jean
2021/12/11
5.9K1
CSS实现最简洁的四角边框
[译]CSS边框实现“无图化”设计
原文:http://www.yuiblog.com/blog/2011/03/08/css-border-tricks-with-collapsed-boxes/ 译文:[cref css-borde
小李刀刀
2018/03/02
8900
css3实现圆角边框渐变
<button class="border">112233</button>   创建button .border{ position: relative; border: 4px solid transparent; border-radius: 16px; background: linear-gradient(orange, violet); background-clip: padding-box; padding: 10px; /* just to show box-shadow s
就只是小茗
2018/03/07
2.7K0
CSS边框倒角
边框倒角(边框圆角)属性 border-radius:值; 单独设置 border-top-left-radius: border-top-right-radius: border-bottom-left-radius: border-bottom-right-radius: #img1{border:1px solid orange; border-top-left-radius:5px; border-top-right-radius:5px; border-bottom-left-radius:5px
十月梦想
2018/08/29
4.3K0
【基础】CSS实现多重边框的5种方式
目前最优雅地实现多重边框的方案是利用CSS3 的 box-shadow属性,但如果要兼容老的浏览器,则需要选择其它的方案。本文简要地列举了几种多重边框的实现方案,大家可以根据项目实际及兼容性要求等情况,选择最适合的实现方案。
毛瑞
2018/05/04
1.9K7
【基础】CSS实现多重边框的5种方式
iOS 每天某些时间点做某些事情
开篇 我们项目启动的时候要弹出一个广告窗口,很简单的一个功能,服务器的判断一下满足条件,即返回数据,客户端判断数据部位NULL,则弹出弹窗 但是老板说,这个要时间短弹出,每天的中午12点到下午2点不能弹出来 这这这,有点坑我们吧,每天存一个key,有点坑吧 仔细想想,没有必要啊,这就是考验我们对时间的操作,代码实现如下: 代码实现 #pragma mark -- 判断是否弹出广告 - (BOOL)isLoadAdvertIn { //当前时间戳 NSTimeInterval int
GuangdongQi
2018/05/24
8280
CSS 边框属性总结
百度百科边框的定义:https://baike.baidu.com/item/css边框
很酷的站长
2023/02/16
2.3K0
CSS 边框属性总结
css边框属性(二)
我们在上一节讲解了如何合并表格边框(消除表格边框间距)。但是在实际开发中,我们有可能要设置一下表格边框的间距。
Qwe7
2022/04/15
2.1K0
CSS 边框秘探
相信你以前肯定尝试过 CSS 中的半透明颜色,比如 rgba() 和 hsla()。
用户8921923
2022/10/24
2.2K0
CSS 边框秘探
纯CSS 神奇的边框特效
阅读本文需要 css 基础。要了解 border-radius 的用法。如果不懂的请先自行查阅 border-radius 的文档。
德育处主任
2022/04/17
2.3K0
纯CSS 神奇的边框特效
CSS尺寸和边框
            1.  px  像素(由一连串的点来组成,像素越高点越多)
十月梦想
2018/08/29
1.7K0
CSS3边框
1、border-radius 圆角是做网页永远绕不过的话题,以前基本是通过背景图片做的,有了CSS3后可以使用简单的属性搞定,可以通过border-radius设置元素的圆角半径。 border-radius: 5px; 对于正方形border-radius设置为边长的一半,就变成圆了。 width: 100px; height: 100px; border-radius: 50px; border-radius是缩写格式,其实border-radius和border属性一样,还可以把各个角单独拆分出来,
小胖
2018/06/27
1.9K0

相似问题

CSS框-折叠边框时边框之间的阴影插入间隙

22

CSS边框点之间的等距?

30

如何实现css点状边框?

20

中心按钮与边框之间的间隙

14

使用MigLayout实现行之间的间隙

34
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档