扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
这篇文章主要讲解了“怎么用vue2.x+turn.js实现翻书效果”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“怎么用vue2.x+turn.js实现翻书效果”吧！
成都创新互联公司是一家专注于网站设计制作、成都网站制作与策划设计,陇川网站建设哪家好?成都创新互联公司做网站,专注于网站建设10多年,网设计领域的专业建站公司;建站业务涵盖:陇川等地区。陇川做网站价格咨询:18982081108
官方网站下载源码：http://turnjs.com/
找到里面的文件 lib/turn.js
放到新建的utils文件里面
Turn.js是使用了jquery书写的，使用vue中要引入jquery
npm install --save jquery
新建vue.config.js配置文件
const webpack = require('webpack')
module.exports = {
chainWebpack: config => {
//引入ProvidePlugin
config.plugin("provide").use(webpack.ProvidePlugin, [{
$: "jquery",
jquery: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery",
}, ]);
},
}我把官方文件引入到本地图片文件使用
查看文件的像素，在设置宽高的时候width是2倍 height不变。
使用vue文件内容