Svelte中如何为嵌套组件绑定非字符串类型的动态属性？

嗨，我来帮你搞定这个问题～

你遇到的TS类型错误，根源其实是属性后面多余的逗号！Svelte的组件属性语法里，不同属性之间不需要用逗号分隔，你在index = { 1 }和paragraphs = {[...]}末尾加的逗号，让TypeScript错误地把这些表达式解析成了对象字面量的一部分，进而导致类型不匹配。

只需要去掉这些多余的逗号，代码就能正常工作了，正确的父组件写法如下：

<script lang="ts">
import MySimpleComponent from './MySimpleComponent.svelte';
</script>

<MySimpleComponent
  index={1}
  paragraphs={[
    'Nisi ab nesciunt sapiente. Et nostrum quo qui quia non.',
    'Aut vel quia vel ducimus eius perferendis.'
  ]}
/>

这里再给你补个小知识点：在Svelte里，用{ }包裹的内容是JavaScript表达式，它会直接保留原本的类型——{1}就是数字类型的1，{[...数组内容]}就是字符串数组类型，完全符合子组件的类型声明要求。只有当你不用{ }直接写值（比如index="1"）时，才会被当作字符串处理哦。

备注：内容来源于stack exchange，提问作者goose_lake