鍍金池/ 問答/HTML/ 顏色改變了,v-model綁定的數(shù)據(jù)bgColor卻沒有發(fā)生改變,應(yīng)該怎么辦?

顏色改變了,v-model綁定的數(shù)據(jù)bgColor卻沒有發(fā)生改變,應(yīng)該怎么辦?

<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<link href="colorpicker/bootstrap-colorpicker.min.css" rel="stylesheet">
<script src="vue.js"></script>

</head>
<body>
<div class="container" id="app">

<div id="mycp" class="input-group colorpicker-component">
    <input type="text" class="form-control" v-model="bgColor"/>
    <span class="input-group-addon"><i></i></span>
    {{bgColor}}
</div>

</div>
<script src="jquery-2.2.3.min.js"></script>
<script src="colorpicker/bootstrap-colorpicker.js"></script>
<script>

$(function () {
    $('#mycp').colorpicker({});
});
var vm = new Vue({
    el: "#app",
    data:{
        bgColor:"rgba(10,10,10,0.5)",
    }
})

</script>
</body>

clipboard.png
最后結(jié)果圖就是這樣

回答
編輯回答
負(fù)我心

clipboard.png

你說的問題是這樣嗎???還是兩個(gè)都沒變

2018年6月1日 20:45
編輯回答
無標(biāo)題

update方法需要調(diào)用,你可以用computed或者watch來實(shí)現(xiàn)

左上角是input,當(dāng)通過js改變他的值時(shí),data數(shù)據(jù)并沒有改變,這是因?yàn)橹苯硬僮髁薲om
clipboard.png

clipboard.png

clipboard.png

2017年10月17日 17:13