Javascript Vuex Typescript：使用变异动态更改模块状态

我不熟悉Typescript，但我正试图通过重新创建以前制作的Vue项目来学习它

今天我开始使用Vuex，但遇到了一个我似乎无法解决的问题

我的商店包含两个不同的模块。有用户模块、选项模块和产品模块。“我的选项”模块内部有一些状态属性，如下所示：

@Module({ name: "Options" })
class Options extends VuexModule {
  agent = "";
  serviceProvider = "";
  wholesaler = "";
...

UPDATE_OPTION: (state, payload) => {
  state[payload.key] = payload.value;
},

@Mutation
public [SET_OPTION](payload: { key: string; value: string }) {
  this[payload.key] = payload.value;
}

现在，为了修改这些状态道具，我使用在一个类似这样的突变中这样做：

@Module({ name: "Options" })
class Options extends VuexModule {
  agent = "";
  serviceProvider = "";
  wholesaler = "";
...

UPDATE_OPTION: (state, payload) => {
  state[payload.key] = payload.value;
},

@Mutation
public [SET_OPTION](payload: { key: string; value: string }) {
  this[payload.key] = payload.value;
}

在我目前的项目中，我尝试这样做：

@Module({ name: "Options" })
class Options extends VuexModule {
  agent = "";
  serviceProvider = "";
  wholesaler = "";
...

UPDATE_OPTION: (state, payload) => {
  state[payload.key] = payload.value;
},

@Mutation
public [SET_OPTION](payload: { key: string; value: string }) {
  this[payload.key] = payload.value;
}

这立即给了我以下错误：元素隐式地具有“any”类型，因为“string”类型的表达式不能用于索引类型“Options”。 在“选项”类型上未找到具有“字符串”类型参数的索引签名

我在谷歌上搜索了这个，但找不到任何与Vuex和TypeScript相关的东西。下面的文章让我对这里发生的事情有了更多的了解：

所以我试着释放

有效载荷。键
：

@Mutation
public [SET_OPTION](payload: { key: string; value: string }) {
  this[payload.key as keyof this] = payload.value;
}

但这给了我另一个错误，说类型“string”不可分配给类型“this[keyof this]”

然后我将
value
的类型改为
any
，而不是
string
，解决了这个问题。但是我更喜欢保留类型字符串