vue学习

最新推荐文章于 2021-08-15 18:22:40 发布

浊清。。。

最新推荐文章于 2021-08-15 18:22:40 发布

阅读量538

点赞数

CC 4.0 BY-SA版权

分类专栏： vue

本文链接：https://blog.youkuaiyun.com/qq_28353055/article/details/85165517

vue 专栏收录该内容

20 篇文章

订阅专栏

数据不实时更新
1.当数据为数组或者对象时， $set(this, 'key', value)可以处理解决

2.可以用watch监听数据变化，如echarts在数据更新时不同步更新
```
watch: {
  detailChar () {
    this.$nextTick(() => {
      this.init()
    })
  }
},
```

solt用于子组件中插入部分内容，可以在插入内容处命名

//父组件引入
<infor-card shadow :color="infor.color" :icon="infor.icon" :icon-size="36">
    <div slot="left">
      <count-to :end="detailRise[i].total" count-class="count-style" >
      <span style="color:#fff;font-size:18px;"> {{infor.title}} </span>
    </div>
    <div slot="right">
      <count-to :end="detailRise[i].total" count-class="count-style" >
      <span style="color:#fff;font-size:18px;"> {{infor.title}} </span>
    </div>
</infor-card>

// inforCard子组件,可不命名，为默认
<div class="left-area" :style="{background: color, width: leftWidth}">
  <Icon class="icon" :type="icon" :size="iconSize" color="#fff"/>
  <div class="right-area" :style="{width: '80%'}">
    <div>
      <slot name="left"></slot>
    </div>
  </div>
</div>
<div class="right-area" :style="{width: rightWidth}">
  <div>
    <slot name="right"></slot>
  </div>
</div>