avalon的常见问题

时间 2019-11-16

标签 avalon 常见问题繁體版

原文原文链接

随着avalon的普及，愈来愈多人加入avalon的你们庭。随之而来的是各类问题。本文在这里统一解答一下。javascript

使用avalon基本上有几个方针要坚持html

数据必须先定义后使用，只能VM中定义，不能V中定义。
数据必须先打扁后使用，好比对象的层次不宜太深，数组不能太长。
页面上不使用太复杂的逻辑，须要的话请封装成函数，也方便本身或后人维护调试。
IE下方法名，属性名注意不区分大小写（由于是VBS）。
IE下方法中的this不必定指向自身。
avalon在domReady时本身执行了一次scan，对于后插入的DOM结构，须要本身手动scan。

SCRIPT1028: 缺乏标识符、字符串或数字

这只发生于IE6-7，它不支持对象最后一个键值对后面添加逗号，如java

 vm.$bOpts = {
         header: "提示信息title",
         content: "提示信息content",
  }

SCRIPT1041: 名称重定义

这是avalon在IE6-8使用VBScript对象建立VM对象引发的，VB对象不支持为对象添加两个相同的属性名git


avalon.define("test", function(vm){
  vm.aaa = 1
  avalon.mix(vm, {
     aaa: 2, //这里出问题了
     bbb: 3
  })
})

此外，因为VBScript变量名不区分大小写github


vm.user = {username: 'lili', userName: 'lilililili'}

这样也会报名称重定义 Error!数组

异步重写空对象出错

这是用法问题dom

<!DOCTYPE html>
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <script src="avalon.js" type="text/javascript"></script>
        <script>
            var model = avalon.define("test", function(vm) {
                vm.data = {}
            })
            setTimeout(function() {
                var data = {
                    a: 1,
                    b: 2,
                    c: 3
                }
              model.data = data //这样正常
             // avalon.mix(model.data, data) //这样会报错
            }, 1000)
        </script>
        <style>
            #aaa{
                width: 100%;
                height:200px;
                background:green;
            }
        </style>
    </head>
    <body ms-controller="test">
       <input ms-duplex="data.a"/>
    </body>
</html>

事件回调的this对象$model, $vmodels不见了的问题

1.3.5已经废掉，源码搜data.param.replace(/-\d+$/, "") ，加上这几行异步

try{
     elem.$vmodel = vmodels[0]
     elem.$vmodels = vmodels
}catch(e){}

或者经过ms-click=callback(avalon.vmodels.xxx)传入你的$vmodel函数

放在button标签的事件点击没有生效

button标签默认会提交页面，产生跳转，所以须要指定type="button"，即<buttton type=button ms-click=check >this

显示隐藏切换失败

<div class="inp,inte" ms-visible="integralCount > 0 && intergralCount > maxIntegral + spendIntegral" >
已超出可以使用积分({{maxIntegral/100}}元),请从新输入
<div>

缘由，不要在视图的指令里面写&& , ||, 请封装为函数

<div class="inp,inte" ms-visible="isVisible(integralCount, maxIntegral ,spendIntegral)" >
已超出可以使用积分({{maxIntegral/100}}元),请从新输入
<div>

交互数组中两个元素的位置失败

缘由，只能经过数组方法，好比splice进行移出插入操做

<!DOCTYPE html>
<html lang="zh-cn">
    <head>
        <title>
            Avalon splice issue
        </title>
        <meta charset="utf-8">
    </head>
    <body>
        <ul ms-controller="test">
            <li ms-repeat="items">{{ el.name }}</li>
        </ul>
        <script src="avalon.js"></script>
        <script>
var test = avalon.define('test', function(vm) {
    vm.items = [
        {
            name: 'First lady'
        },
        {
            name: 'Second boy'
        },
        {
            name: 'Third guy'
        }
    ];
});

var temp = test.items.splice(2, 1);
test.items.splice(1, 0, temp[0].$model);//若是是简单数据类型,就不须要.$model
        </script>
    </body>
</html>

IE6-8下报window.execScript 这一行错误

、

多是你的VM上定义了一个很大的数组引起的

vm.err大IE6-8下报错

type, err, erm, me是VBScript关键字

ms-controller="aaa"，aaa这个VM只能应用一个元素上，页面上不能出现一个VM同时应用于两个元素

低版本IE使用VBScript，不支持未婚先孕！

若有更多问题，请统一在这里提 https://github.com/RubyLouvre/avalon/issues/509