使用reqire.js 生成二维码

最新推荐文章于 2024-03-20 09:47:59 发布

weixin_30325793

最新推荐文章于 2024-03-20 09:47:59 发布

阅读量94

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/sanmubird/p/8046321.html

本文介绍如何利用RequireJS管理非AMD规范的jQuery及插件依赖，通过具体实例展示了如何配置RequireJS以加载和使用这些库，实现二维码生成等功能。

最新项目中使用到 reqiure.js ; 使用了一个月的感觉是: 这个确实是一个利器,如果会使用的话,能轻易理顺js之间的依赖关系,从而可以重复使用js,可以减少代码量,可以提升开发速度,但是刚开始上手用点很不适应.

这次使用reqiure.js 引用非 AMD规范的 jquery 和 jquery的插件 jquery.qrcode.js utf.js ;

先来张效果图:

接着上关键部分代码:

main.js

requirejs.config({
    baseUrl: "js/lib",
    shim: {
        'jquery.qrcode': {
            deps: ['jquery', 'utf']
        }
    }
});

require(['jquery', 'jquery.qrcode'], function($, x) {
    jQuery('#qrcodeCanvas').qrcode({
        render: "canvas",
        text: "标题: 逍遥游 ;\n发布人: 庄子;\n发布单位: 道号 ;\n审核人: 老聃 ;\n发布时间: 东周战国",
        width: "200", //二维码的宽度
        height: "200", //二维码的高度
        background: "#ffffff", //二维码的后景色
        foreground: "#000000", //二维码的前景色
        src: 'img/1.jpg' //二维码中间的图片
    });
});