avalon2

Version:

an elegant efficient express mvvm framework

31 lines (30 loc) • 747 B

HTML

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>新组件系统测试</title>
        <script type="text/javascript" src="../../dist/avalon.js"></script>
    </head>
    <body>
        <div ms-controller='widget1' >
            <ms-button>{{@aaa}}</ms-button>
        </div>
        <h1>你会看到111,然后又变成222</h1>
        <script type="text/javascript">      
avalon.component('ms-button', {
    template: '<button type="button" ><span><slot /></span></button>',
    defaults: {
        buttonText: "button"
    },
    soleSlot: 'buttonText'
})
var vm = avalon.define({
    $id: 'widget1',
    aaa: 111
})
setTimeout(function(){
    vm.aaa = 222
},2000)

        </script>
    </body>
</html>