elementui自定义头部render-header

https://cn.vuejs.org/v2/guide/render-function.html 官方api文档。。。参数配置-渲染函数

大概效果就是增加模糊搜索。。然后列表展示。
elementui自定义头部render-header_第1张图片

	这种是直接显示-----


      
      
    
render-header  ---直接添加一个搜索框用户输入然后直接显示

 methods: {
    renderHeader (h, { column }) {
      // 下拉框内容包裹在一个div里面
      return h(
        'el-dropdown', [
        h(
          'span', {

          domProps: {
            innerHTML: '名称'
          }
        },
        ),
        h(
          'el-dropdown-menu', {
          slot: 'dropdown'
        }, [
          h('el-input', {
            props: {
              value: '',
              placeholder: '请输入名称'
            },
            on: {
              input: value => {
                console.log(value);
                // console.log(this.$store.state)
                // this.SET_APPLABS('')
                // console.log(this.projectsData.app_labs)
                // this.$store.state.projectsData.app_labssplice(0, 1)
                // this.projectsData.app_labs.splice(0, 1)
              }
            }
          })
        ]
        )
      ]
      )
    },


elementui自定义头部render-header_第2张图片

你可能感兴趣的:(个人)