RubyLouvre / avalon

an elegant efficient express mvvm framework
http://avalonjs.coding.me/
Other
5.8k stars 1.42k forks source link

多层数组嵌套的bug(2.06) #1424

Closed Midqiu closed 8 years ago

Midqiu commented 8 years ago
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body ms-controller="page">
<div id="div">
    <ul>
        <li ms-for="el in @current.friends"><span ms-for="item in el">{{item.name}}</span></li>
    </ul>
</div>
<script src="../../lib/avalonjs/avalon.js"></script>
<script>
    var vm = avalon.define({
        $id: 'page',
        array: [{
            name: "zs",
            friends: [[{name: 'ls0'},{name: 'ls1'},{name: 'ls2'}]]
        }, {
            name: "zs",
            friends: [[{name: 'ls1'},{name: 'ls2'},{name: 'ls3'}],[{name: 'ls1'},{name: 'ls2'},{name: 'ls3'}]]
        }],
        current: {}
    })
    vm.current=vm.array[0]
    setTimeout(function () {
        document.title = 'change'
        vm.current = vm.array[1]
    }, 1500)

</script>
</body>
</html>
RubyLouvre commented 8 years ago

正在排查,的确有这问题

RubyLouvre commented 8 years ago

如果你要重复用一个对象的一些属性对VM进行重复赋值,最后要深拷贝一下原始数据

avalon.mix(true, ArrayOrObject, yourArrayOrObject)

当然,原来的avalon也有BUG,升级到今天的版本就好了

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body ms-controller="page">
        <div id="div">
            <ul>
                <li ms-for="el in @current.friends">
                    <p ms-for="item in el">{{item.name}}</p>
                </li>
            </ul>
            <button ms-click="@click | prevent">change</button>
        </div>
        <script src="../dist/avalon.js"></script>
        <script>
       var data = [{
            name: "zs",
            friends: [[{name: 'ls22'}, {name: 'ls44'}, {name: 'ls55'}]]
        }, {
            name: "zs",
            friends: [
                [{name: 'ls1'}, {name: 'ls2'}, {name: 'ls3'}],
                [{name: 'ls1'}, {name: 'ls2'}, {name: 'ls3'}]
            ]
        }]
var vm = avalon.define({
    $id: 'page',
    array: avalon.mix(true, [], data),// data是一个数组,因此要用[]
    current: {},
    click: function(){
        this.current =avalon.mix(true, {}, data[1])// data[1]是一个对象,因此要用{}
    }
})
vm.current = avalon.mix(true, {}, data[0])

        </script>
    </body>
</html>
RubyLouvre commented 8 years ago

已经修复,更新6.7的版本