Flyui教程特殊讲解

1、require模块
jsp页面中使用script标签引入require并使用模块，例如

标签语义相当于先引入require，再require(‘news-survey.js’)

2、在js中使用新插件，由于require模块化使用AMD规范，因此从外部引入插件时必须先确定插件是否支持AMD规范，在插件主js文件（如swiper.jquery.js）底部查看是否有类似如下的导出代码（以swiper为例）：

/*===========================
Swiper AMD Export
===========================*/
if (typeof(module) !== 'undefined')
{
    module.exports = window.Swiper;
}
else if (typeof define === 'function' && define.amd) {
    define([], function () {
        'use strict';
        return window.Swiper;
    });
}

如有类似上述的代码，则可以引入到项目中，引入方式与其他插件一样。

3、flyui数据源fly.dataSource注意事项，只针对url请求模式：

1. read中使用原始参数查询，参数用data声明对象
2. dataFilter的回调函数的参数是json字符串，在该函数可以重新组装数据，但组装后的数据必须以json字符串的形式返回
3. 在js中无参调用数据源方法，vm.ds.fetch()
4. 在js中带参调用数据源方法，vm.ds.filter(params)
5. 在js中获取数据源方法，vm.ds.data()
   示例：

  var id = fly.utils.getQueryString('id'), apiUrl = '';
  // 视图模型
  var vm = fly.observable({
    param: {
      title: ''
    },
    dataList: [],
    // 列表数据源
    ds: fly.dataSource({
        read: {
          url: `${apiUrl}`,
          data: {id: id},
          type: 'GET',
          dataFilter: function(data) {
            var res = fly.evalJSON(data);
            res.rows.forEach(function(item) {
              // 改造数据
              ......
            })

            // 如果在页面中没有直接使用ds而是使用dataList
            vm.set('dataList', res.rows)

            return JSON.stringify(res);
          }
        }
    }),
    refreshTable: function() {
      var params = vm.get('param').toJSON();
      vm.ds.filter(params);
    }
  })

  // 如果在页面中没有直接使用ds而是使用dataList，进入页面立即使用js发起ds请求，否则会自动发起请求
    vm.ds.fetch()

  $(document).ready(function() {
    fly.bind('body', vm);
  });

4、运用模板在页面中使用数据源的数据