// 创建model 更多创建模式请参后文
var searchModel = new ModelProxy( {
searchItems: 'Search.getItems' // 自定义方法名: 配置文件中的定义的接口ID
} );
// 使用model, 注意: 调用方法所需要的参数即为实际接口所需要的参数。
searchModel.searchItems( { q: 'iphone6' } )
// !注意 必须调用 done 方法指定回调函数，来取得上面异步调用searchItems获得的数据!
.done( function( data ) {
console.log( data );
} )
.error( function( err ) {
console.log( err );
} );
ModelProxy的功能丰富性在于它支持各种形式的profile以创建需要业务model：
使用接口ID创建>生成的对象会取ID最后'.'号后面的单词作为方法名
复制代码 代码如下:
ModelProxy.create( 'Search.getItem' );
使用键值JSON对象>自定义方法名: 接口ID
复制代码 代码如下:
ModelProxy.create( {
getName: 'Session.getUserName',
getMyCarts: 'Cart.getCarts'
} );
使用数组形式>取最后 . 号后面的单词作为方法名
下例中生成的方法调用名依次为: Cart_getItem, getItem, suggest, getName
复制代码 代码如下:
ModelProxy.create( [ 'Cart.getItem', 'Search.getItem', 'Search.suggest', 'Session.User.getName' ] );
前缀形式>所有满足前缀的接口ID会被引入对象，并取其后半部分作为方法名
复制代码 代码如下:
ModelProxy.create( 'Search.*' );
同时，使用这些Model，你可以很轻易地实现合并请求或者依赖请求，并做相关模板渲染
【例二】 合并请求
复制代码 代码如下:
var model = new ModelProxy( 'Search.*' );
// 合并请求 (下面调用的model方法除done之外，皆为配置接口id时指定)
model.suggest( { q: '女' } )
.list( { keyword: 'iphone6' } )
.getNav( { key: '流行服装' } )
.done( function( data1, data2, data3 ) {
// 参数顺序与方法调用顺序一致
console.log( data1, data2, data3 );
} );
【例三】 依赖请求
复制代码 代码如下:
var model = new ModelProxy( {
getUser: 'Session.getUser',
getMyOrderList: 'Order.getOrder'
} );
// 先获得用户id，然后再根据id号获得订单列表
model.getUser( { sid: 'fdkaldjfgsakls0322yf8' } )
.done( function( data ) {
var uid = data.uid;
// 二次数据请求依赖第一次取得的id号
this.getMyOrderList( { id: uid } )
.done( function( data ) {
console.log( data );
} );
} );
此外ModelProxy不仅在Node端可以使用，也可以在浏览器端使用。只需要在页面中引入官方包提供的modelproxy-client.js即可。
【例四】浏览器端使用ModelProxy
复制代码 代码如下:
<!-- 引入modelproxy模块，该模块本身是由KISSY封装的标准模块-->
<script src="https://www.jb51.net/modelproxy-client.js" ></script>
<script type="text/javascript">
KISSY.use( "modelproxy", function( S, ModelProxy ) {
// !配置基础路径，该路径与第二步中配置的拦截路径一致!
// 且全局配置有且只有一次！
ModelProxy.configBase( '/model/' );
// 创建model
var searchModel = ModelProxy.create( 'Search.*' );
searchModel
.list( { q: 'ihpone6' } )
.list( { q: '冲锋衣' } )
.suggest( { q: 'i' } )
.getNav( { q: '滑板' } )
.done( function( data1, data2, data3, data4 ) {
console.log( {
"list_ihpone6": data1,
"list_冲锋衣": data2,
"suggest_i": data3,
"getNav_滑板": data4
} );
} );
} );
</script>