JavaEE-SSM-订单管理-前端增删改功能实现

3.5 功能2：添加

• 从列表页面切换到添加页面
  
  编写对应添加页面的路由

*

  {
    path: '/orderAdd',
    name: '添加订单',
    component: () => import('../views/OrderAdd.vue')
  }

• 编写添加功能
  

3.6 功能3：修改

• 列表页面跳转到更新页面，以参数的方式传递id
  

修改

编写路由

xxxxxxxxxx   {    path: '/orderUpdate',    name: '修改订单',    component: () => import('../views/OrderUpdate.vue')  }

创建路由对应的vue页面

• 编写修改功能：先通过id查询详情，并回显到表单，修改内容后，提交表单

3.7 功能4：删除

• 点击进行删除
  

删除

• 删除操作

          async deleteOrderById(oid) {
              // 需确认是否删除
              if(confirm("您确认要删除么？")) {
                  // ajax删除
                  let { data } = await this.$http.delete(`/order/${oid}`)
                  // 提示
                  alert(data)
                  // 刷新结果：重新查询
                  this.selectAllOrder()
              }
          }
  

• 列表页面的完整代码