setup 函数 todo-list

<template>
  <div class="todo-list">
    <ul>
      <li 
        v-for="(item, index) in state.stus" 
        :key="item.id" 
        @click="removeStu(index)"
      >
      {{ item.name }}
      </li>
    </ul>
  </div>  
</template>
<script>
import { reactive } from 'vue'
export default {
  setup() {
    let {state, removeStu} = removeItem()
    return {
      state,
      removeStu
    }
  }
}

function removeItem() {
  let state = reactive({
        stus: [
          {
            id: '0',
            name: 'vue'
          },
          {
            id: '1',
            name: 'js'
          },
          {
            id: '2',
            name: 'css'
          }
        ]
      })

  function removeStu(index) {
    state.stus = state.stus.filter((stu, idx) => idx !== index)
  }

  return {
    state,
    removeStu
  }
} 
</script>

定义数据和处理方法写到了一起，没有被分割到 vue2.x data 和 methods 中