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

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 613 天前的主题，其中的信息可能已经有所发展或是发生改变。

在初学 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>

2 条回复

zcf0508

2023-04-19 19:19:05 +08:00 via Android

data 是一个函数，应该返回一个对象，你现在这不符合语法

jlak

2023-04-19 19:21:20 +08:00

@zcf0508 感谢，一针见血，原来不是 22 行有问题，是我把 vue3 和 vue2 搞混了