求前端大佬们帮我看看这里为什么报错

在初学 vue ，代码也是抄来的，ide 用 vsc 和 codespaces 22 行（ persons:[ ）的冒号报错我实在看不懂 ide 提示 ';' expected.javascript any 但是;加哪里完全看不出来

<html>
<head>
<meta charset="utf-8">
<title>Vue 学习</title>
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
</head>
<body>
<div id="app">
  <input type="text" placeholder="输入" v-model="keyWord">
  <ul>
    <li v-for="(p,index) of filPersons" :key="index">
      {{p.name}}-{{p.age}}-{{p.sex}}
    </li>
  </ul>
</div>
    
<script>
const app = {
  data() {
    keyWord:'',
    persons:[
      {id:'001',name:"马冬梅",age:19,sex:'女' },
      {id:'002',name:"周冬雨",age:20,sex:'女' },
      {id:'003',name:"周杰伦",age:21,sex:'男' },
      {id:'004',name:"温兆伦",age:22,sex:'男' }
    ]
  },
  computed: {
    filPersons(){
      return this.persons.filter((p)=>{
        return p.name.indexOf(this.keyWord) !== -1
      })
    }
    
  }
}
 
Vue.createApp(app).mount('#app')
</script>
</body>
</html>

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/933828

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.