vue+element tree ----增加修改删除上下移动

vue+element tree ----增加修改删除上下移动

参见

https://blog.csdn.net/SQY_candy/article/details/83448329







也开始是 render

treeRender(h, { store, node, data }) {
      return h(
        "span",
        {
          style: {
            display: "inline-block",
            width: "99%"
          },
          on: {
            mouseenter: e => {
              e.path[0].style.backgroundColor = "#EBF7FF";
            },
            mouseleave: e => {
              e.path[0].style.backgroundColor = "#F5F7F9";
            }
          }
        },
        [
          h("span", [
            h("Icon", {
              props: {
                type: data.fmlbh ? "ios-albums" : "md-albums"
              },
              style: {
                marginRight: "8px"
              }
            }),
            h("span", data.mlxsmc)
          ]),
          h(
            "span",
            {
              style: {
                display: "inline-block",
                float: "right"
              }
            },
            [
              h(
                "span",
                {
                  style: {
                    display: "inline-block",
                    width: "0",
                    marginRight: "232px"
                  }
                },
                data.remark
              ),
              h(
                "span",
                {
                  style: {
                    display: "inline-block",
                    width: "0",
                    marginRight: "243px"
                  }
                },
                data.mlsxh
              ),
              h(
                "span",
                {
                  style: {
                    display: "inline-block",
                    width: "0",
                    marginRight: "230px"
                  }
                },
                data.mllx == 1 ? "卷" : "目录"
              ),
              h(
                "span",
                {
                  style: {
                    display: "inline-block",
                    width: "0",
                    marginRight: "175px"
                  }
                },
                data.mlbh
              ),
              h(
                "span",
                {
                  style: {
                    display: "inline-block",
                    width: "0",
                    marginRight: "235px"
                  }
                },
                data.createTime
              ),
              h(
                "span",
                {
                  style: {
                    display: "inline-block",
                    width: "0",
                    marginRight: "250px"
                  }
                },
                data.lastModifiedTime
              ),
              h(
                "Button",
                {
                  props: Object.assign(
                    {},
                    {
                      type: "warning",
                      size: "small",
                      icon: "md-create"
                    }
                  ),
                  style: {
                    fontSize: "12px !important"
                  },
                  on: {
                    click: () => {
                      this.editCatalog(data);
                    }
                  }
                },
                "编辑"
              ),
              h(
                "Button",
                {
                  props: Object.assign(
                    {},
                    {
                      type: "primary",
                      size: "small",
                      icon: "ios-arrow-up"
                    }
                  ),
                  style: {
                    marginLeft: "8px",
                    fontSize: "12px !important"
                  },
                  on: {
                    click: () => {
                      this.upMove(node, data);
                    }
                  }
                },
                "上移"
              ),
              h(
                "Button",
                {
                  props: Object.assign(
                    {},
                    {
                      type: "primary",
                      size: "small",
                      icon: "ios-arrow-down"
                    }
                  ),
                  style: {
                    marginLeft: "8px",
                    fontSize: "12px !important"
                  },
                  on: {
                    click: () => {
                      this.downMove(store, node, data);
                    }
                  }
                },
                "下移"
              )
            ]
          )
        ]
      );
    },
```````


你可能感兴趣的:(vue+element tree ----增加修改删除上下移动)