zoukankan      html  css  js  c++  java
  • Vue笔记(props和 mounted)

    1.mounted

      1.1mounted中使用$nextTick会导致页面挂掉

    1 mounted() {
    2 // 页面卡死
    3     this.$nextTick(() => {
    4       this.setUrl()
    5     })
    6   }

    2.props

      2.1props传过去的值,第一时间在mounted是获取不到的。因为是异步传值的。

      解决方法:(1)使用watch;(2)将需要进行的处理在父组件进行操作,然后将操作完的值直接传给子组件。

     1 watch: {
     2   datas: function (val) {
     3      
     4    }
     5  }
     6  7 (父)
     8 <examAchSearchHeader :exprotUrl="exprotUrl"></examAchSearchHeader>
     9 ...
    10 this.exportUrl = XXXX
    11 (子)
    12 props: {
    13     exportUrl: String
    14 }

      2.2通过props传给子组件的值变化后子组件接收到 和 通过refs访问子组件方法中使用接收到的参数变化的顺序问题

      通过refs访问时,接收到的参数是变化前的参数。还是因为异步的问题。可以强制赋值改变,或用watch等。

     1 // parent
     2 <examAchTable ref="achTable" :dataList="examAchList"></examAchTable>
     3 
     4 // 若这里不强制赋值一下,在examAchList变化后直接调用子组件的transData方法时,子组件dataList仍是变化前的值
     5 this.$refs.achTable.dataList = this.examAchList
     6 this.$refs.achTable.transData(res.data.totalRecord)
     7 
     8 // child
     9 transData(total) {
    10       if (this.dataList) 
    11     // ...
    12 }

    持续更新中...

  • 相关阅读:
    北航OO第三单元总结
    北航OO第二单元总结
    提问回顾和个人总结
    Unity 制作不规则形状button
    Unity 3D手游对不同分辨率屏幕的UI自适应
    软工结队作业
    CSDN app分析
    软工作业——求交点
    软工第一次作业
    软工热身作业
  • 原文地址:https://www.cnblogs.com/ljwsyt/p/10594923.html
Copyright © 2011-2022 走看看