vue+element-ui 实现todoList(增删改查)

最新推荐文章于 2024-08-23 20:23:30 发布

风继续吹&

最新推荐文章于 2024-08-23 20:23:30 发布

阅读量734

点赞数

分类专栏： vue.js 文章标签： vue.js

本文链接：https://blog.csdn.net/qq_48930299/article/details/117711291

版权

本文介绍如何利用Vue.js框架结合Element-UI组件库，实现一个功能完善的TodoList应用，涵盖添加、删除、修改和查询等基本操作。通过这个实战教程，读者将学习到Vue的组件化开发和Element-UI的使用技巧。

摘要由CSDN通过智能技术生成

在这里插入图片描述

<template>
  <div>
    <el-input
      placeholder="请输入内容"
      v-model="input"
      @change="submit"
      style="width: 200px; margin: 20px 0px"
    >
      <!-- <template #suffix>
        <div class="icon">
          <span class="el-icon-camera-solid"></span>
        </div>
        <div class="icon">
          <span :style="{ color: fontcolor }">{
   {
    input.length }}/10</span>
        </div>
      </template> -->
    </el-input>

    <el-table
      :data="list"
      style="width: 100%"
      :default-sort="{ prop: 'sort', order: 'descending' }"
    >
      <el-table-column
        label="排序"
        prop="sort"
        sortable
        :sort-method="handelSort"
      >
        <template slot-scope="scope">
          <el-input
            type="text"
            style="width: 50px"
            v-model="scope.row.sort"
            @change="changesort"
          ></el-input>
        </template>
      </el-table-column>

      <<

最低0.47元/天解锁文章