解决layui框架excel导出长数据科学计数法问题 Layui框架自带的导出excel数据默认导出的数据会以数字格式存放，比较长的数据存放后会经过科学计数法加工，从而导致数据错误解决方法：1、在/lib/layui-v2.5.5/lay/modules/table.js中搜索：d.exportFile2、将d.exportFile这个函数，用下面内容替换掉： d.exportFile = function (e, t, i) { t = t || d.clearCacheKey(d.cache[e]), i = i || "csv"; var a = c.config[e] || {}, // 分页按钮 l = {csv: "text/csv", xls: "application/vnd.ms-excel"}[i], // meta格式 n = document.createElement("a"), // a 标签 type = i, meta = l, title = a.title layui.each(t, function (ks, vs) { var inner = {} layui.each(vs, function (k, v) { if (/^\d{9,}$/.test(v)) { vs[k] = vs[k] + '\t' } inner[k] = vs[k] }); t[ks] = inner }) if (r.ie) { var i = [], a = []; layui.each(t, function (t, l) { var n = []; "object" == typeof e ? (layui.each(e, function (e, a) { 0 == t && i.push(a || "") }), layui.each(d.clearCacheKey(l), function (e, t) { n.push(t) })) : d.eachCols(e, function (e, a) { a.field && "normal" == a.type && !a.hide && (0 == t && i.push(a.title || ""), n.push(l[a.field])) }), a.push(n.join(",")) }); var data = i.join(",") + "\r\n" + a.join("\r\n") navigator.msSaveBlob(new Blob(['\ufeff' + data], {type: meta + ';charset=utf-8;'}), title + '.' + type) } else { return n.href = "data:" + l + ";charset=utf-8,\ufeff" + encodeURIComponent(function () { var i = [], a = []; return layui.each(t, function (t, l) { var n = []; "object" == typeof e ? (layui.each(e, function (e, a) { 0 == t && i.push(a || "") }), layui.each(d.clearCacheKey(l), function (e, t) { n.push(t) })) : d.eachCols(e, function (e, a) { a.field && "normal" == a.type && !a.hide && (0 == t && i.push(a.title || ""), n.push(l[a.field])) }), a.push(n.join(",")) }), i.join(",") + "\r\n" + a.join("\r\n") }()), n.download = (a.title || "table_" + (a.index || "")) + "." + i, document.body.appendChild(n), n.click(), void document.body.removeChild(n)} },

Layui修改刷新当前页面记录搜索值 在开发项目中，我们需要保存成功之后，刷新父页面，也就是重新加载并保存之前搜索数据，可以使用那面的代码实现1、监听搜索操作，保存到sessionStorage// 监听搜索操作 form.on('submit(data-search-btn)', function (data) { var result = JSON.stringify(data.field); // layer.alert(result, { // title: '最终的搜索信息' // }); // 将电话，卡号，姓名保存到sessionStorage sessionStorage.setItem('telValue', JSON.stringify(data.field.tel)); sessionStorage.setItem('cardValue', JSON.stringify(data.field.card)); sessionStorage.setItem('nameValue', JSON.stringify(data.field.name)); //执行搜索重载 table.reload('currentTableId', { page: { curr: 1 } , where: { searchParams: result } }, 'data'); return false; });2、刷新select选择框渲染，给表单赋值 // 刷新select选择框渲染 form.render('select'); //给表单赋值 form.val("filter", { //filter 即 class="layui-form" 所在元素属性 lay-filter="" 对应的值 "tel": JSON.parse(sessionStorage.getItem('telValue')), "card": JSON.parse(sessionStorage.getItem('cardValue')), "name": JSON.parse(sessionStorage.getItem('nameValue')), }); //从表单取值 var data1 = form.val("filter");//filter 即 class="layui-form" 所在元素属性 lay-filter="" 对应的值 console.log(data1); var result = {card: JSON.parse(sessionStorage.getItem('cardValue')), tel: JSON.parse(sessionStorage.getItem('telValue')), name: JSON.parse(sessionStorage.getItem('nameValue'))}; var result2 = JSON.stringify(result); console.log(result2) //执行搜索重载 table.reload('currentTableId', { page: { curr: 1 } , where: { searchParams: result2 } }, 'data');

react项目引入antd框架和路由 1、 安装antd框架npm i antd2、 安装路由npm i react-router-dom3、 引入antd打开项目下的src\App.js，添加如下代码import {Button} from 'antd'; import 'antd/dist/antd.css';使用测试<Button type="primary">Primary</Button>

react如何使用路由、路由使用方法 1、 首先安装路由npm i react-router-dom插件，已安装的可以跳过npm i react-router-dom2、打开项目下src\index.js文件，添加如下代码import {HashRouter as Router, Switch, Route} from 'react-router-dom'; import Login from './pages/Login/Login'; import Wecome from './pages/Home/Wecome';3、 路由部分代码，path为路径，component为组件地址ReactDOM.render( <Router> <Switch> <Route path="/login" component={Login}/> <Route path="/wecome" component={Wecome}/> </Switch> </Router>, document.getElementById('root') );4、 完全index.js路由代码import React from 'react'; import ReactDOM from 'react-dom'; import {HashRouter as Router, Switch, Route} from 'react-router-dom'; import './index.css'; import reportWebVitals from './reportWebVitals'; import Login from './pages/Login/Login'; import Wecome from './pages/Home/Wecome'; ReactDOM.render( <Router> <Switch> <Route path="/login" component={Login}/> <Route path="/wecome" component={Wecome}/> </Switch> </Router>, document.getElementById('root') ); // If you want to start measuring performance in your app, pass a function // to log results (for example: reportWebVitals(console.log)) // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals reportWebVitals();5、 访问：输入下面url即可访问http://localhost:3000/#/login

React路由封装、404页面设置 1、 项目根目录下新建routes路由文件夹和路由文件index.js，在index.js添加如下代码，用与存放路由、配置路由，分别添加了mainRoutes和adminRoutes模块import Login from '../pages/Login/Login'; import Wecome from '../pages/Home/Wecome'; import PageNotFound from '../pages/PageNotFound/PageNotFound'; export const mainRoutes = [ { path: '/login', component: Login }, { path: '/404', component: PageNotFound } ] export const adminRoutes = [{ path: '/admin/wecome', component: Wecome }]2、 项目更目录src\index.js相关代码：import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import reportWebVitals from './reportWebVitals'; import {HashRouter as Router, Switch, Route, Redirect} from 'react-router-dom'; import { mainRoutes } from './routes' import App from './App'; ReactDOM.render( <Router> <Switch> <Route path="/admin" render={routeProps=><App {...routeProps} />}/> {mainRoutes.map(route=>{ return <Route key={route.path} {...route}/>; })} <Redirect to="/404"/> </Switch> </Router>, document.getElementById('root') ); // If you want to start measuring performance in your app, pass a function // to log results (for example: reportWebVitals(console.log)) // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals reportWebVitals();3、 修改项目根目录app.js下代码，引入adminRoutes代码，用来显示后台相关页面import React from "react" import { Switch, Route, Redirect } from 'react-router-dom'; import { adminRoutes } from './routes'; function App() { return ( <div className="App"> <h1>app</h1> <Switch> {adminRoutes.map(route=>{ return <Route key={route.path} path={route.path} exact={route.exact} render={routeProps=>{ return <route.component {...routeProps}/> }} /> })} </Switch> </div> ); } export default App;4、新建/pages/PageNotFound/，并创建文件PageNotFound.js，做404页面import React from 'react' function PageNotFound() { return ( <div> <h1>404</h1> </div> ) } export default PageNotFound上面封装好路由也，如果页面url不存在，则会跳转到404页面。