学习笔记（有关数据请求和页面模块显示）

v-if

1、可以在页面提交前和提交后具有差别的时候使用（很好用），可以少写几个页面

v-if="item.Index===false"
v-else

2、可以显示从不同模块进来显示的不同数据

v-if="index==0"
v-if="index==1"
v-if="index==2"
v-if="index==3"

3、当使用v-if时，会出现页面先执行if的语句，再加载else的语句，即页面同一个地方会出现闪跳（出现一个模块如何被另外一个模块替代）。这时可通过定义一个字段，使其为false，在页面渲染后使其变为true，就可以让else语句直接出现，就不会出现闪跳。
4、当页面进行跳转时，由于下一个页面的methods会在created中进行加载，所以console会报错（没有数据），这个时候v-if也可以用，但是使用后页面加载会停顿一点

data: {
            flag: false,
        },

methods: {
             Add: function () {
                 var self = this;
                 $.post("@Url.Action("XXX", "xx")", function (res) {
                     self.flag = true;
                 });
             }
        },

 v-if="flag"

getQueryString

从上个页面传参数过来，让当前页面可以连接数据
1、不要传太多，容易混乱

window.location.href = '@Url.Action("页面名称", "页面所在文件夹名称")/?index=' + key ;

index: getQueryString("key"),

v-for

1、不是所有data里面的数组显示数据需要写v-for循环
2、在循环数组的时候，要注意key（该数组的key）和type（传进来的数据种类）的区别使用，同时需要看打印的数据，是否使用错乱（就是把下个模块的数据传到上个模块）。

post

$.post("@Url.Action("XXX", "xx")", { 传进来的参数 }, function (res) {
//res时传进来的数据
}

异步加载，是指两个post同时加载、同时传入。因为想要使用第一个post请求得到的数据库的model数据，因此在第二个post请求的{传参}地方写了model.id，但实际上使获取不到的。
因为是异步加载，即使第二个post请求下console.log（this.model.id）可以打印出来，那是因为第二个post请求的{ 传参 }地方已经加载完成了，但是第一个post请求还未加载完，所以此时model数组里面使空的，所以{传参}中获取model数组中的值是空的

layui-form

1、form.render()页面重新渲染
2、form.render很重要，不能乱放，在最外层需要放一个
3、当vue和form一起运行的时候，可能存在vue会使form加载不出来的情况，需要注意
4、可在vue的methods中写获取数据的方法，方法再在生命周期created中运行（不能用beforeCreate，因为这个时候Vue还没加载出来）
5、需在vue生命周期mounted中写form重新渲染的方法，重点是再运行一次获取数据的方法

layui

1、required是指不可为空
2、可通过lay-verify="tit"定义方法，实现一些基本功能，例如不能为空，不能重复提交

<textarea class="layui-input" lay-verify="required" v-if="index==''"></textarea>
<textarea class="layui-input"  lay-verify="tit" disabled v-else>{{index}}</textarea>
form.verify({
        tit: function (value) {
            console.log(value);
            if (value != '') {
                return '您已经提交过，无需再次提交';
            }
        }
    })

background-image

1、文字为白，通过background-image，可以使文字看起来像在轮播变色