动态改变第三方UI框架的样式

quote

What makes life dreary is the want of motive. -- George Eliot

有时候想动态改变第三方UI框架(比如element)某个组件的样式,利用ref属性操作dom是个不错的选择。自己封装的组件当然不会选择这样做的,我们可以直接操作数据即可。

主要面对的场景是需要根据实际需求动态设置第三方框架的组件内的样式,而组件内部并没有暴露数据接口给与设置的情况下。此时利用ref操作dom就显得很有必要了。

isFullScreen: {
        handler(newVal, oldVal) {
          if(newVal) {
            this.$refs.vuiTagView.$children[0].$el.style.border = 'none'
          } else {
        this.$refs.vuiTagView.$children[0].$el.style.borderRight = '1px solid #eee'
          }
        },
        deep: true
      }

上面的代码是根据用户当前浏览的网页是否全屏动态设置一个组件的border样式。

评论没有加载,检查你的局域网

Cannot load comments. Check you network.

eat();

sleep();

code();

repeat();