注册登录

1***@qq.com

1***@qq.com

发布：2022-06-02 18:47
更新：2023-11-16 10:51
阅读：3640

uniapp button组件type类型的类型

分类：uni-app

button

typescript下，button类型自动检测为ElementAttrs<ButtonHTMLAttributes>，导致type的类型是：

<button type="primary" size="mini">访问</button>

不能将类型“"primary"”分配给类型“"button" | "submit" | "reset" | undefined”。ts(2322)

我尝试再.d.ts文件中加入

declare module 'vue' {  
  interface ButtonHTMLAttributes {  
    type?: 'primary'  
  }  
}

但是报错了

后续属性声明必须属于同一类型。属性“type”的类型必须为“"submit" | "reset" | "button" | undefined”，但此处却为类型“"primary" | undefined”。ts(2717)
这该怎么处理啊，求大佬们指教。

2022-06-02 18:47 负责人:无分享

11 个回复

htycoder

htycoder - htycode

在env.d.ts文件中添加下面的代码可以解决报错

declare namespace JSX {
interface IntrinsicElements {
button: UniHelper.Button
}
}

或者

declare namespace JSX {
interface IntrinsicElements {
button: any
}
}

别忘了给个点赞
赞赞

麻烦贴下代码或者可复现 demo，以便更好的帮助您解决问题，谢谢！

7***@qq.com

同样问题，用的 vscode

2022-07-06 16:47

1***@163.com

基于 vue-cli 默认模板搭建的项目

vscode的语法校验是为web做的，未兼容小程序。
良好的开发体验推荐使用HBuilderX。
问题已确认，相关团队的开发人员正在协助解决，感谢您的反馈！

z***@163.com

楼上+1，有办法通过声明定义解决吗，看着报错很舒服...

2022-06-14 22:11

7***@qq.com

+1+1

9***@qq.com

不更新源码版本的话，自己增加联合类型吧，暂时可以这么搞

我不是漫游

我不是漫游 - yangxin

同样的问题，搜索不到解决方案，求官方大大弄一弄。，全是红的，开发难受

r***@outlook.com

r***@outlook.com

官方没解决这类问题之前可以安装uni-app-types，能解决原生组件和uniapp组件的类型提示的冲突问题
https://github.com/ModyQyW/uni-helper/tree/main/packages/uni-app-types

还有其他增强在vscode上开发uni-app体验的配套插件包可以看看
https://juejin.cn/post/7156482845614030862

_落木

请问下这个冲突怎么解决的，目前vue-cli创建的项目，"@uni-helper/uni-app-types": "^0.5.4", "@dcloudio/uni-app": "3.0.0-alpha-3070720230316001", 还是有这个问题

2023-04-18 17:21

l***@foxmail.com

l***@foxmail.com

我使用uni-app-types也没有解决，然后再全局进行覆盖，才解决```typescript
declare global {
namespace JSX {
interface IntrinsicElements {
button: UniHelper.Button;
}
}
}

错误是由 @vue\runtime-dom 报的，可以这样解决，在 tsconfig.josn 配置

{  
  "vueCompilerOptions": {  
    "nativeTags": ["template", "slot"]  
  }  
}

由于 uni 中没有几个 html标签，所以需要设置的不多。
vueCompilerOptions 配置项由 Vue Language Features (Volar) 插件提供。

官方就是没有写相关的d.ts声明文件。

DCloud_UNI_WZF

这个类型错误是 vue 的 runtime-dom.d.ts 报的，和 dcloudio/types 没关系

2022-07-06 18:11

要回复问题请先登录或注册