前端模块化开发应用——日历组件开发

1、创建组件：calendar_test3spm2

2、在package.json中引入依赖：

"dependencies": {
        "jquery": "<=1.9",
        "backbone": "~1",
        "moment": "~2",
        "observer": "~0",
        "lodash": "~3",
        "nunjucks-slim":"~1.1",
        "jquery-chosen": "~0",
        "common-model":"~0",
        "style-base":"~0",
        "layer":"~2"
    },

 在源码calendar_test3spm.js中调用依赖：

 1 /引入依赖
 2 var $ = require('jquery');
 3 var _ = require('lodash');
 4 var backbone = require('backbone');
 5 var nunjucks = require('nunjucks-slim');
 6 var moment = require('moment');
 7 var observer = require('observer');
 8 var chosen = require('jquery-chosen');
 9 var CommonModel = require('common-model');
10 var layer=require('layer');
11     
12 //引入样式
13 require('../css/calendar_test3spm-theme-base.css');
View Code

3、首先进行整个日历功能（包括翻年月）的功能实现：（写在源码中的backbone.View框架中）

 

4、模板文件写于：\trunk\template\calendar_test3spm.html中，主要是：第一行区域选择的DOM，下部的日历展示的DOM。

 

5、样式文件写在：\trunk\css\calendar_test3spm-theme-bass.css

 

6、在\trunk\examples\index.html

 

posted on 2017-02-05 12:13  CuriousZero  阅读(1169)  评论(0)  编辑  收藏  举报

导航