});
layui.data(‘test’, null); // Delete test table
//Modify: the same as add. The stored data will be overwritten
//[query]: read all data from the test table
var localTest = layui.data('test');
console.log(localTest.admin);
[]( )3.6 Layui How to use internal jQuery --------------------------------------------------------------------------------------- because Layui Some built-in module dependencies jQuery，So we will jQuery1.11 The most stable version as a built-in DOM Module (the only third-party module). Only if the module you use depends on it, it will load, and if your page has script Introduced jquery，It does not load repeatedly. Built in jquery Module removes Global $and jQuery，It's a match layui Standardized standard module. So you must get it in the following ways:
//Actively load jquery module
layui.use(['jquery', 'layer'], function(){
Var $= layui. $/ / key points
,layer = layui.layer;
//Then it's the same as you usually use jQuery
$('body').append('hello jquery');
});
//If the built-in module itself depends on jquery, you don't need to use jquery, so the above writing can actually be:
layui.use('layer', function(){
Var $= layui. $/ / because the layer elastic layer depends on jQuery, it can be obtained directly
,layer = layui.layer;
//......
});
[]( )3.7 extend Layui modular ------------------------------------------------------------------------------ layui Sometimes the modules provided may not meet your needs, or you may try to follow them layer Module specification to extend a module. Then you need to know layui.define()Method, I believe you have read it in the "underlying method" on the left side of the document. Now let's expand one Layui Module bar: Step 1: confirm the module name, assuming: mymod，Then create a new one mymod.js Put the file in any directory of the project (Note: do not put it in layui Table of contents) Step 2: write test.js As follows:
/**
Extend a test module
**/
layui.define(function(exports) {/ / prompt: modules can also depend on other modules, such as layui.define('layer ', callback);
var obj = {
hello: function(str){
alert('Hello '+ (str||'mymod'));
}
};
//Output test interface
exports('mymod', obj);
});
Step 3: set the directory where the extension module is located, and then it can be in another directory JS Used in the file
//config settings are global
layui.config({
base: '/ res/js /' / / suppose this is the root directory where you store the extension module
}). extend({/ / set module alias
Mymod: 'mymod' / / if mymod.js is in the root directory, you can also not set an alias
, mod1: 'admin/mod1' / / relative to the subdirectory of the above base directory
});
//You can also ignore the root directory set by base and directly specify the path in extend (Main: this function is new to layui 2.2.0)
layui.extend({
mod2: ‘{/} http://cdn.xxx.com/lib/mod2 ’//{/} means to adopt its own path, that is, not follow the base path
})
//Use expansion module
layui.use(['mymod', 'mod1'], function(){
var mymod = layui.mymod
,mod1 = layui.mod1
,mod2 = layui.mod2;
mymod.hello('World! '); / / pop up Hello World!
});
[](
)3.8.Interface specification
---------------------------------------------------------------------------
### [](
)3.8.1.Normative principles
* The data returned by the interface is displayed: the front end only performs rendering logic processing;
* Rendering logic prohibits calling across multiple interfaces;
* The front end pays attention to interaction and rendering logic to avoid business logic processing as far as possible;
### [](
)3.8.2.data format
* Response data format
{
"code": 200, //Request processing status
"msg": "success", //Request processing message
"url": null, //Request address
"count": 2,
"data": \[{}, {}...\]
}
code: Request processing status
-
100 ERROR: Code exception
-
200 OK: the server successfully returns the data requested by the user
-
201 CREATED: the user successfully creates or modifies data.
-
202 Accepted: indicates that the request has entered the background queue.
-
400 INVALID REQUEST: the request sent by the user has an error.
-
401 Unauthorized: the user does not have permission.
-
403 Forbidden: access is prohibited.
-
404 NOT FOUND: the request is for a record that does not exist.
-
406 Not Acceptable: the format requested by the user is incorrect.
-
500 international server error: an error occurred in the server.
[]( )4\. Component description ========================================================================= []( )4.1 form ----------------------------------------------------------------------- table The default data format specified by the component is:
{
"code": 0,
"msg": "",
"count": 1000,
"data": [{}, {}]
}
If you want to reformat the returned data, you can use response Parameters, such as:
table.render({
elem: '#demp'
,url: ''
,response: {
statusName: 'status' //Specifies the field name of the data status. Default: code ,statusCode: 200 //Specify the successful status code. Default: 0 ,msgName: 'hint' //Specifies the field name of status information. Default: msg ,countName: 'total' //Specifies the field name of the total number of data. Default: count ,dataName: 'rows' //Specifies the field name of the data list. Default: data
}
//,... / / other parameters
});
Parameters for paging requests: page,limit Reset the name, such as:
table.render({
elem: '#demp'
,url: ''
share
**[CodeChina open source project: [analysis of front-end interview questions of large factories + learning notes of core summary + actual combat of real projects + latest explanation Video]](
)**
This article has been CodeChina open source project: [analysis of front-end interview questions of front-line large factories + core summary learning notes + real project practice + latest explanation Video] Collection, self-study programming route and series of technical articles are constantly updated