在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ Vue計(jì)算屬性問(wèn)題:好像 img.src 屬性的變化都不會(huì)影響到屬性的計(jì)算

Vue計(jì)算屬性問(wèn)題:好像 img.src 屬性的變化都不會(huì)影響到屬性的計(jì)算

<html>
<head>
</head>
<body>
<div id="app">
    <img :src="imgsrc"/>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<script>
var vm = new Vue({
    el : '#app',
    data : {
        img : {}
    },
    created : function(){
        var that = this;
        setTimeout(function(){
            that.img.src = 100;
        },1000);
    },
    computed : {
        imgsrc : function(){
            return this.img.src == null ? 'www.baidu.com' : 'www' + this.img.src;
        }
    }
});
</script>
</html>

如上圖直接源碼,目前的場(chǎng)景和上述非常類似,后臺(tái)傳回的img src的 前后兩段 url 需要拼接,如果沒(méi)有 后段 認(rèn)為沒(méi)有圖片,給出一個(gè)默認(rèn)的圖片url?,F(xiàn)在的問(wèn)題在于不管是直接 :src 還是 計(jì)算屬性,好像 img.src 屬性的變化都不會(huì)影響到屬性的計(jì)算,求解,謝謝!

回答
編輯回答
伴謊

data從的img再實(shí)例初始化的時(shí)候會(huì)被添加vue數(shù)據(jù)綁定的方法set和get,而自定義的img.src屬性被不會(huì)被添加數(shù)據(jù)綁定,從而不會(huì)被vue的觀察者模式檢測(cè)到,所以變化也不會(huì)被渲染,自定義屬性需要使用this.set('對(duì)象',‘屬性’,‘值’),或者vue.$set

2017年11月21日 21:00
編輯回答
爛人

利用 $set 這個(gè)API來(lái)設(shè)置可以嗎?

2018年5月6日 01:30
編輯回答
愛(ài)是癌

這個(gè)是和那個(gè)data里邊的對(duì)象相關(guān),vue的文檔里寫的設(shè)置給data的object會(huì)遞歸遍歷屬性設(shè)置set get,需要初始化一下。

2017年3月23日 17:23
編輯回答
選擇
<html>
<head>
</head>
<body>
<div id="app">
  <img :src="img.src"/>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<script>
var vm = new Vue({
  el : '#app',
  data : {
    img : {
      src: ''
    }
  },
  created : function(){
    var that = this;
    setTimeout(function(){
      that.img.src = 'https://afp.alicdn.com/afp-creative/creative/u124884735/55308755880f8b637dde1f88b84ea9da.png';
    }, 1000);
  },
  computed : {
    'img.src' : function(val){
        return this.img.src == null ? 'www.baidu.com' : 'www' + this.img.src;
    }
  }
});
</script>
</html>
2018年8月30日 08:44