Typescript 子组件中的Setter编译但引发错误

在我的组件中，我有一个简单的可见性参数：

<template>
  <b-modal :visible.sync="_modalVisible" size="md" title="Add new event group" centered header-bg-variant="light" ok-title="Add" ok-variant="info" @hide="hideModal()">
    Hello.
  </b-modal>
</template>

<script lang="ts">
import Vue from "vue";

export default Vue.extend({
  name: "AddNewEventGroupModal",
  data() {
    return {
    }
  },

  props: {
    // Variables.
    modalVisible: Boolean
  },

  computed: {
    _modalVisible: {
      get: function () {
        return this.modalVisible; // ERROR here!!
      }
    }
  },

  methods: {
    hideModal() {
      this.$emit("toggle-visibility", false);
    }
  }
});
</script>

你好
从“Vue”导入Vue；
导出默认Vue.extend({
名称：“AddNewEventGroupModal”，
数据（）{
返回{
}
},
道具：{
//变量。
modalVisible:布尔型
},
计算：{
_modalVisible：{
get:function（）{
返回this.modalVisible；//此处出错！！
}
}
},
方法：{
hideModal（）{
这是.$emit（“切换可见性”，false）；
}
}
});

但是，此代码可以正常工作（已成功编译），但很快就会引发错误：

类型“”上不存在属性“modalVisible”（（）=>any）| “计算选项”。类型上不存在属性“modalVisible” “（）=>任何”

我想了解为什么会发生这种情况，以及如何解决它。有趣的是，它可以工作（功能正常，并且已经编译），但仍然会引发错误

如果很重要，家长会这样称呼孩子：

<add-new-event-group-modal :modalVisible.sync="addNewVisibility" :eventGroupApi="eventGroupApi" :newEventGroup="newEventGroup" @toggle-visibility="toggleAddNewVisibility"></add-new-event-group-modal>

---

从

：visible.sync=“\u modalVisible”

，我想在某个时候，计算变量

\u modalVisible

将得到更新，问题是，它没有设置器，请尝试添加一个设置器

computed: {
    _modalVisible: {
        get: function () {
            return this.modalVisible; // ERROR here!!
        },
        set(val) {
            this.modalVisible = val;
        }
    }
},