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

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,可以使文字看起来像在轮播变色

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值