vue todolist，2024新鲜出炉阿里巴巴面试真题，大佬整理

box-shadow:0 0 5px #666;

}

.add-input{

position:relative;

margin:0;

width:100%;

font-size:24px;

font-family:inherit;

font-weight:inherit ;

line-height:1.4em;

border:none;

outline:none;

color:inherit;

box-sizing:border-box;

// font-smoothing:antialiased;

padding:16px 16px 16px 36px;

border:none;

box-shadow:inset 0 -2px 1px rgba(0, 0, 0, 0.03);

}

子组件header.vue

Todo

子组件item.vue

<input

type=“checkbox”

class=“toggle”

v-model=“todo.completed”

{{todo.content}}

<button class=“destory” @click=“deleteTodo”>

子组件tabs.vue

{{this.unfinishedTodo.length}} items left

<span v-for=“state in states” :key=“state” :class=“[state, filter === state ? ‘actived’: ‘’]” @click=“toggleFilter(state)”>

{{state}}

<span class=“clear” @click=“clearAllCompleted”>清除已完成