mobx-miniprogram-bindings icon indicating copy to clipboard operation
mobx-miniprogram-bindings copied to clipboard

结合TS使用`ComponentWithStore`时,无法在`this`上找到action方法

Open kkaatii opened this issue 1 year ago • 5 comments

实例代码片段如下:

ComponentWithStore({
    storeBindings: {
        store,
        fields: ...,
        actions: {
            update: 'updateNum',
        },
    },
    methods: {
        submit() {
            this.update(...) // 报错说`update`在`ComponentWithStoreInstance<...>`上不存在
        },
    },
})

kkaatii avatar Sep 12 '24 09:09 kkaatii

用的版本是?

LastLeaf avatar Sep 20 '24 03:09 LastLeaf

请参考 #47 和 #51 。

LastLeaf avatar Sep 20 '24 03:09 LastLeaf

你们更新了src/index.ts,但是TS类型推导使用了types/index.d.ts。后面这个文件里的类型定义还是3.X版本的。

kkaatii avatar Sep 23 '24 02:09 kkaatii

Sorry 。 4.0.0 发布有问题,发布了 4.0.1 来修复。

LastLeaf avatar Sep 25 '24 07:09 LastLeaf

另外, actions 段的末尾需要加一个 as const ,如:

    storeBindings: {
        store,
        fields: ...,
        actions: {
            update: 'updateNum',
        } as const,
    },

LastLeaf avatar Sep 25 '24 07:09 LastLeaf

希望你们出一个ts的完整demo,我今天集成的好痛苦,各种爆红, 花了很多时间解决的也不是很完美

lilin87788 avatar Oct 15 '24 09:10 lilin87788

image

lilin87788 avatar Oct 15 '24 09:10 lilin87788

image

这整段标红报的是什么错误信息?

LastLeaf avatar Oct 16 '24 03:10 LastLeaf

image

lilin87788 avatar Oct 16 '24 06:10 lilin87788

image 如上图: 我还有一些在非page 或者 component 中使用到mobx 的地方 这些使用是合理的吗,或者有没有正确的使用demo,我急切的需要一个demo

lilin87788 avatar Oct 16 '24 06:10 lilin87788

image 这个是我store 的定义

lilin87788 avatar Oct 16 '24 06:10 lilin87788

image

这整段标红报的是什么错误信息?

这个地方 只要 fields 这里的as const 去掉 就不爆红了

lilin87788 avatar Oct 17 '24 01:10 lilin87788

image

用的 typescript 版本是?

LastLeaf avatar Oct 18 '24 04:10 LastLeaf

image 如上图: 我还有一些在非page 或者 component 中使用到mobx 的地方 这些使用是合理的吗,或者有没有正确的使用demo,我急切的需要一个demo

在其他地方用同一个 mobx store 当然是可以的。这个模块只是帮助你把 store 用在 page/component 上,不会影响 store 本身。

先别急,先分析清楚你的问题,我们再看看要不要针对性的加个 example 。

LastLeaf avatar Oct 18 '24 04:10 LastLeaf

说句可能相关的--微信开发工具使用的类型推理可能和VSCode不一致。我目前使用新版在VSCode中不会报错,但是微信开发工具中报错,不知道是哪里配置的问题。

kkaatii avatar Oct 18 '24 04:10 kkaatii

说句可能相关的--微信开发工具使用的类型推理可能和VSCode不一致。我目前使用新版在VSCode中不会报错,但是微信开发工具中报错,不知道是哪里配置的问题。

很可能是 typescript 版本不一样。这个模块有很多类型体操,受版本影响很大。

LastLeaf avatar Oct 18 '24 04:10 LastLeaf

image 如上图: 我还有一些在非page 或者 component 中使用到mobx 的地方 这些使用是合理的吗,或者有没有正确的使用demo,我急切的需要一个demo

在其他地方用同一个 mobx store 当然是可以的。这个模块只是帮助你把 store 用在 page/component 上,不会影响 store 本身。

先别急,先分析清楚你的问题,我们再看看要不要针对性的加个 example 。 image 比如我这么使用问题大吗?

lilin87788 avatar Oct 18 '24 05:10 lilin87788

typescript

请问typescript的版本在哪里看

lilin87788 avatar Oct 18 '24 05:10 lilin87788

image

用的 typescript 版本是?

image

lilin87788 avatar Oct 18 '24 05:10 lilin87788

image 如上图: 我还有一些在非page 或者 component 中使用到mobx 的地方 这些使用是合理的吗,或者有没有正确的使用demo,我急切的需要一个demo

在其他地方用同一个 mobx store 当然是可以的。这个模块只是帮助你把 store 用在 page/component 上,不会影响 store 本身。 先别急,先分析清楚你的问题,我们再看看要不要针对性的加个 example 。 image 比如我这么使用问题大吗?

这个模块的原理是在 Store 上面挂一个 reaction ,和 store 本身被如何使用是没有关系的。

LastLeaf avatar Oct 18 '24 06:10 LastLeaf

image

用的 typescript 版本是?

image

这个看到的是全局的 tsc 版本。

编译的时候用的 typescript 一般是 node_modules 里面的那个 typescript 的版本。 IDE 里面用的有可能又是另一个版本。

确认不同的 tsc 是不是都会报这个错,可以用手工用 tsc 命令编一下这个文件:

  • tsc PATH 是用全局安装的 tsc 编译;
  • npx tsc PATH 用 node_modules 里面的 tsc 编译。

LastLeaf avatar Oct 18 '24 06:10 LastLeaf

image 您在看下

lilin87788 avatar Oct 18 '24 06:10 lilin87788

能不能加下微信,解决完问题后我自己删除微信,保证不打扰大佬的生活

lilin87788 avatar Oct 18 '24 06:10 lilin87788

image 您在看下

直接在 tsc 后面加上你要编的那个项目的 tsconfig.json ,如 tsc -p tsconfig.json ,看看是不是还有相同的报错。

LastLeaf avatar Oct 18 '24 06:10 LastLeaf

image 您在看下

直接在 tsc 后面加上你要编的那个项目的 tsconfig.json ,如 tsc -p tsconfig.json ,看看是不是还有相同的报错。

大佬我觉得你可能考虑错了 storeBindings: { store: userStore, fields: ['token', 'isLogin'], actions: ['updateToken','updateUserInfo'] as const, }, 只有在fields 那里添加 as const 才报错 在actions 那里不报错,说明as const 这个语法是正常能使用的

lilin87788 avatar Oct 18 '24 07:10 lilin87788

image 您在看下

直接在 tsc 后面加上你要编的那个项目的 tsconfig.json ,如 tsc -p tsconfig.json ,看看是不是还有相同的报错。

大佬我觉得你可能考虑错了 storeBindings: { store: userStore, fields: ['token', 'isLogin'], actions: ['updateToken','updateUserInfo'] as const, }, 只有在fields 那里添加 as const 才报错 在actions 那里不报错,说明as const 这个语法是正常能使用的

get 。试下 README TypeScript 接口 这一节里面的这个例子是不是会报错?

LastLeaf avatar Oct 18 '24 09:10 LastLeaf

image 您在看下

直接在 tsc 后面加上你要编的那个项目的 tsconfig.json ,如 tsc -p tsconfig.json ,看看是不是还有相同的报错。

大佬我觉得你可能考虑错了 storeBindings: { store: userStore, fields: ['token', 'isLogin'], actions: ['updateToken','updateUserInfo'] as const, }, 只有在fields 那里添加 as const 才报错 在actions 那里不报错,说明as const 这个语法是正常能使用的

get 。试下 README TypeScript 接口 这一节里面的这个例子是不是会报错?

效果如下: fields 不加 as const image

fields 加 as const image

lilin87788 avatar Oct 18 '24 09:10 lilin87788

@lilin87788 这个小程序有使用 ts 和这个库,可以参考下 https://github.com/F-loat/xiaoplayer ,我这边目前类型提示都正常的

F-loat avatar Oct 21 '24 11:10 F-loat

我这不会报错。

估计得看下实际用到的 tsc 版本了。

报错的环境是小程序开发者工具?

LastLeaf avatar Oct 21 '24 11:10 LastLeaf

可能和 #55 是一个问题。请尝试升级到 v5.0.0 和 miniprogram-api-typings ^4.0.0 。

LastLeaf avatar Nov 13 '24 04:11 LastLeaf