搜索到
28
篇与
的结果
-
nodejs ORM框架sequelize.js实体常用配置 请输入图片描述const sequelize = require('../db/sequelize'); const Sequelize = require('sequelize'); const User = sequelize.define('user', { id: { type: Sequelize.INTEGER, field: 'id', primaryKey: true, autoIncrement: true }, username: Sequelize.STRING, password: Sequelize.STRING, email: Sequelize.STRING, nickname: Sequelize.STRING, createdAt: { type: Sequelize.DATE, field: 'created_at' }, updatedAt: { type: Sequelize.DATE, field: 'updated_at' }, }, { // 实例对应的表名 tableName: 'user', // 如果需要sequelize帮你维护createdAt,updatedAt和deletedAt必须先启用timestamps功能 timestamps: true, // 将createdAt对应到数据库的created_at字段 createdAt: 'created_at', // 将updatedAt对应到数据库的updated_at字段 updatedAt: 'updated_at', // And deletedAt to be called destroyTime (remember to enable paranoid for this to work) deletedAt: false, //'deleted_at', // 删除数据时不删除数据，而是更新deleteAt字段 如果需要设置为true，则上面的deleteAt字段不能为false，也就是说必须启用 paranoid: false }); module.exports = User; -
vue低版本浏览器兼容性（20181224更新） promise在低版本浏览器需要通过pollyfill处理不同浏览器对promise解析的差问题，处理方法为，在main.js里加入如下代码import promise from 'es6-promise'; promise.polyfill();webpack中的babel处理的目录是在webpack.base.conf.js中通过includes配置的，默认没有包含node_modules下的库文件，某些npm包没有做es6新语法的处理，我们的webpack又没有编译这部分文件，就会报错，最常见的就是let，const，因为很多浏览器都已经支持let，const，但是低版本浏览器不支持，所以我们需要在include中加上这些没处理的包，处理方法为：在includes中加上对应的node_modules包的目录名，切记不要直接加入node_modules,因为有些npm包不能通过webpack编译，而且也太了。build里面的webpack.base.conf.js的module中配置{ test: /\.js$/, loader: 'babel-loader', include: [ resolve('src'), resolve('test'), resolve('node_modules/_swiper@4.4.6@swiper'), resolve('node_modules/_dom7@2.1.2@dom7'), resolve('node_modules/webpack-dev-server/client' )] }
-
react学习笔记之react-router4.x中JS路由跳转 在react开发单页应用的时候，有时我们需要通过js触发路由的跳转而不是紧紧通过Link组件链接跳转。如：登录成功自动跳转到网站首页或者redirect页；在ajax请求中，通过公共方法验证登录token是否有效，如果无效跳转到登录页等等。针对上面的两种情况，就有两种路由跳转场景，第一种：在中间中触发路由跳转，第二种：在非Component组件的js中触发路由跳转，这两种场景的跳转方法分别为：一，组件中跳转到另一个路由组件：从react-router-dom中导入withRouter方法import { withRouter } from 'react-router-dom';使用withRouter方法加工需要触发路由跳转的组件export default withRouter(Login);通过withRouter加工后的组件会多出一个history props，这时就可以通过history的push方法跳转路由了。this.props.history.push('/home');二，非组件JS函数中触发路由跳转从history中导入createHashHistory方法（如果您的react应用使用的是history路由则导入createBrowserHistory）import { createHashHistory } from 'history'; // 如果是hash路由 import { createBrowserHistory } from 'history'; // 如果是history路由React-Router v4.0上已经不推荐使用hashRouter，主推browserRouter，但是因为使用browserRouter需要服务端配合可能造成不便，有时还是需要用到hashRouter。创建history实例const history = createHashHistory();跳转路由history.push('/login');
-
-
解决Macos下storm系列IDE卡顿的问题 最近在使用phpstorm开发项目的时候，只要加载JavaScript文件，不管有多大，如果项目文件数据比较多的话，都能够让phpstorm卡到死机。其中调整过内存设置，关闭过动态提示，使用过phpstorm的安全模式，都不能解决卡的问题。中间也试过放弃phpstorm，改用其他IDE开发。但都没有phpstorm那么好用。没办法，在国内的百度无法找到解决方案，只能出去找了。最终在一个国外论坛里，看到不一样的回答。只要修改两个Java虚拟机参数，就彻底解决了卡的问题了。操作步骤如下：找到phpstorm.vmoptions文件，macos环境下，找到phpstorm/webstorm文件，右键选择“显示包内容”，打开Contents->bin ->phpstorm.vmoptions/webstorm.vmoptions使用记事本打开。添加以下两行代码：// orm/phpstorm启用硬件加速 -Dawt.usesystemAAFontSettings=lcd -Dawt.java2d.opengl=true思考：phpstorm是使用JAVA开发的。由于IDE提供源文件关键字渲染功能，我们对文件的任何编辑或移动鼠标，都会触发渲染操作。而phpstorm默认的JAVA环境并没有利用机器的硬件加速技术去实现实时渲染，因此当然会让系统卡死。而只要在JAVA环境中让系统默认使用硬件加速，就可以解决占用系统资源过大，让phpstorm卡的问题了。注：此文章转自 http://blog.csdn.net/orrinzeng/article/details/51335815
-
让gulp-webserver自动化开发服务器支持SSI语法 （include等） var webserver = require('gulp-webserver'); var connectSSI = require('connect-ssi'); gulp.task('webserver', function() { gulp.src('./') .pipe(webserver({ fallback: './views/error.html', livereload: true, directoryListing: true, port:8000, open: true, middleware: [ connectSSI({ ext: '.shtml', // file extension. Only urls ending in this will be evaluated. baseDir: __dirname // base path to look in for files }) ] })); });在gulpfile.js中加入上面的配置代码（核心是middleware那里的connectSSI配置），我们就可以使用.shtml文件格式的html了，从而在代码中可以使用ssi的语法实现一些本来需要后端支持的功能，如：include提取公共部分，避免前端coder们头疼的大量复制粘贴工作
-
网页图片加载错误的处理 在网站中，经常会遇到一种情况，很多图片要么因为图片地址本身指向一个未知地址（404地址），要么因为图片服务器自身的原因未能给img返回正确的图片文件流，就会导致图片错误或者alt信息，如果没有给相应的img设置宽高，甚至还会影响整个页面的布局，针对以上问题，我们可以采用监听图片的error事件然后做相应的处理。如：<img src="图片地址" onerror="this.src='替换图片地址'"/>按正常逻辑，上面的处理不会有问题，但是容易忽略一种情况，那就是替换的图片地址如果也不存在，那onerror里面的代码就会反反复复地执行，直到请求到图片为止，如果一直请求不到，那就相当于一个死循环了。对此，对以上代码添加一行代码this.onerror=none;在执行完第一次图片替换后，取消图片的error事件监听。上面的代码如果用jquery实现就是下面这样$("img").each(function (index,ele) { $(ele).one("error",function () { $(this).attr("src","替换图片地址"); }) });用one绑定的事件只会执行一次，所以不会出现死循环的情况
-
swiper使用技巧（一） Swiper是一个非常好用的轮播插件，满足各种各样的使用条件和环境，响应式，多列，多行，等等，但是，很多时候还是会有一些条件下Swiper提供的API并不能直接帮我们解决问题，但是都可以通过变通的方式处理。今天要分享的就是关于swiper的左右切换按钮，分页导航的显示或者隐藏的问题。有些时候，我们的需求是这样的，1，当swiper没有多页的时候，左右按钮不出现，2，多于一页的时候，左右按钮出现，但是不能向前或者向后时，左右按钮会有不能点击的状态。swiper在初始化的时候会为不能点击的左右按钮加上‘swiper-button-disabled’这个class，我们可以用css为这个class添加相应的样式，如果要隐藏，可以直接隐藏掉，但是这样做的话，当左右按钮只有一个是disabled状态时，就会出现一边有一边没有的情况。解决这个问题的方法是，我们在swiper初始化后获得swiper对象，然后获取swiper.isBeginning和swiper.isEnd属性，然后判断如果这两个属性同时为true那就表示，swiper在同一时间，既不能向前slide也不能向后slide了，那就说明没有超过一页，然后我们就可以执行我们想执行的逻辑了。当然，如果你的swiper不是根据屏幕大小调整显示的数量的响应式的，那就不用这个麻烦，直接判断slide的个数就行了，需要注意的是，这种方法判断时，一定要在浏览器窗口大小改变时，手动触发swiper的update事件，然后再获取isBeginning和isEnd属性，这样获取到的才会是swiper响应式地调整了数量之后的结果。gridSwiper.update(); let $gridSwiperCheck = this.$('.swiper-container-horizontal .home-todo-check'); if (gridSwiper.isBeginning === gridSwiper.isEnd) { $gridSwiperCheck.hide(); } else { $gridSwiperCheck.show(); }
