vue常见问题

2020-08-20  本文已影响0人  随风飞2019

vue移动端隐藏滚动条

html,body {
        width: 100%;
        height: 100%;
        overflow-y: auto;
    }
html::-webkit-scrollbar,
body::-webkit-scrollbar {
        width: 0px
    }

element-ui的table解决表头与内容不对齐的问题

在app.vue全局加入如下代码
<style lang="scss">
.el-table th.gutter {
display: table-cell !important;
}
</style>

vue界面不刷新三种解决办法

1. Object.assign强制更新
this.obj = Object.assign({ haha: '111' }, this.obj)
这样,视图上就可以更新出{{obj.haha}}

2.this.$forceUpdate()强制视图更新
data定义obj: { label: '省', value: 'provice' }
方法里如下操作:
this.obj.haha = 'haha'
console.log(this.obj)    // 此时已经有haha属性了,但视图没有更新
this.$forceUpdate()     // 加上强制更新后,页面上就会出现

3. this.$set
this.list[0] = { info: { name: 'haha', age: 23 } }
这样操作一个数组,视图是无法更新
可以使用this.$forceUpdate()强制更新,也可以如下强制设置数组
this.$set(this.list, 0, { info: { name: 'haha', age: 23 } })

this.$set还可以设置对象this.$set(this.obj,'haha','哈哈')
上一篇下一篇

猜你喜欢

热点阅读