layuiAdmin (单页版)常见问题
单页版缓存问题
由于单页面版本的视图文件和静态资源模块都是动态加载的,所以可能存在浏览器的本地缓存问题,因此,为了避免改动后的文件未及时生效,只需在入口页面(默认为start/index.html)中,找到 layui.config ,修改其 version 的值即可。
//开发环境
version: new Date().getTime() //刷新页面,都会更新一次缓存
//生产环境
version: '2.2.0.1' //每次发布项目时,跟着改动下该属性值即可更新静态资源的缓存
动态模板中的 select 正确用法
当试图用动态模板输出 <select>元素 的 <option></option> 时,务必注意不要将动态模板结构放在 select 内部,而应该将 select 整体放在动态模板内,然后在遍历输出 option,如:
<script type="text/html" lay-url="" template>
<select name="" lay-filter="">
{{# layui.each(d, function(index, item){ }}
<option value="{{ item.value }}">{{ item.title }}</option>
{{# }); }}
</select>
</script>
由于 select 标签的特殊性,很多人将 <script type="text/html" lay-url="" template> </script> 放在了 select 标签的里面,导致无法正确输出相应视图,所以请务必纠正写法。
刷新动态模板
需要对一个已经渲染完毕的动态模板再次进行刷新,可以借助 view 模块的 refresh 方法
<script type="text/html" id="testID" template lay-url="" lay-data="" lay-done="">
<div lay-templateid="testID"> <!-- 注意:此处 lay-templateid 属性值需要与模版定义的 ID 值一致 -->
内容放此处
</div>
</script>
然后在需要执行模版刷新的地方执行
view('testID').refresh();
设置 table 的 token
尽管 admin.req() 方法会自动传递 token,但 layui 中涉及到接口请求的公共组件(如:table、upload)并不走 admin.req(),这时就需要你获取本地存储的 token 赋值给接口参数,方式如下:
方式一:设置单个 table 实例的 token
//设置单个 table 实例的请求 token
table.render({
elem: '#xxxx'
,url: 'url'
,headers: { //通过 request 头传递
access_token: layui.data('layuiAdmin').access_token
}
,where: { //通过参数传递
access_token: layui.data('layuiAdmin').access_token
}
});
方式二:设置全局 table 实例的 token(推荐)
//所有 table 实例均会有效,这样就不用在每个 table.render() 都设置一次 token
table.set({
headers: { //通过 request 头传递
access_token: layui.data('layuiAdmin').access_token
}
,where: { //通过参数传递
access_token: layui.data('layuiAdmin').access_token
}
});
一般情况,结合实际需求,headers 和 where 二者中设置一个即可。
这里 access_token 的命名对应 config.js 定义的 tokenName 的值
目前upload组件没有全局设置的方法,需自行添加
设置 layedit 富文本编辑器的上传图片 token 或 额外参数
需要使用到富文本编辑器,用了layui自带的layedit,不过上传图片时报错:“请求上传接口异常”,因接口需要携带token和额外参数,修改如下:
layedit.set({
uploadImage: {
url: setter.api_url + '/admin/slide/upload'
, headers: {AccessToken: layui.data(setter.tableName).AccessToken} //这里增加headers
, data: {} //增加携带data
}
});
o.render({
url: r.url
, method: r.type
, elem: e(n).find("input")[0]
, headers: r.headers //增加携带headers,或者也可以携带data
, data: r.data //增加携带data
, done: function (e) {
0 == e.code ? (e.data = e.data || {}, v.call(t, "img", {
src: e.data.src, alt: e.data.title
}, a)) : i.msg(e.msg || "上传失败")
}
})
解压密码: detechn或detechn.com
免责声明
本站所有资源出自互联网收集整理,本站不参与制作,如果侵犯了您的合法权益,请联系本站我们会及时删除。
本站发布资源来源于互联网,可能存在水印或者引流等信息,请用户自行鉴别,做一个有主见和判断力的用户。
本站资源仅供研究、学习交流之用,若使用商业用途,请购买正版授权,否则产生的一切后果将由下载用户自行承担。