请问 requirejs 能否写一个公共模块 如何向这个公用模块里传参？
0
[已关闭问题]
关闭于 2017-07-06 11:40
比如 多个页面都用到增删改方法 ，现在能否写一个公共的模板，各个页面用到时调用就行，而不是需要每个页面都要写一遍？？
问题补充：
$(document).ready(function() { //绑定新增按钮 $("#add_btn").click(function(e){ addOrUpdate('0');//新增 }); //绑定修改按钮 $("#update_btn").click(function(e){ addOrUpdate('1');//修改 }); //绑定删除按钮 $("#del_btn").click(function(e){ deletePlan(); }); }); //新增 function addOrUpdate(type) { var title = ''; var guid = ''; if(type=='0'){//新增 title = '新增执法计划'; }else{ title = '修改执法计划'; var selectedRows = planGrid.fnGetSelected(); if (selectedRows != null && selectedRows.length != 1) { layer.msg("请选择一条执法计划!", {icon: 0}); return; } guid = selectedRows[0].guid; } layer.open({ type: 2, title: title, content:"${ctx}gtPatrolPlan/addOrUpdate.html?guid="+guid, area:["550px","600px"], shadeClose:true, maxmin:true }); } //删除 function deletePlan() { var selectedRows = planGrid.fnGetSelected(); var ids = ""; if (selectedRows == null || selectedRows.length == 0) { layer.msg("请选择要删除的角色!", {icon: 0}); } else{ layer.confirm('确定要删除所选记录？', {icon: 3, title:'提示'}, function(index){ for(var i=0, len = selectedRows.length; i < len; i++){ ids += selectedRows[i].guid; if(i != selectedRows.length - 1){ ids += ","; } } $.ajax({ async : true, cache : false, url : "${ctx}gtPatrolPlan/delete.html", data : { "ids" : ids }, dataType : "json", type : "post", success : function(data) { if (data.flag == "true") { layer.msg("删除成功!", {icon: 1}); planGrid.reload(); } else { layer.msg("删除失败!", {icon: 2}); } }, error : function(data) { layer.msg("网络故障!", {icon: 0}); } }); //layer.close(index); }); } }
请问 以这段代码为例 ，应该怎么写呢？求一段实例
主要的哪些放到模块里，传参怎么传？？各个页面要使用的话怎么调用？？
能否给出具体代码？实在是没用过require，加上水平有限，现在一头雾水。
非常感谢
所有回答(3)
0
必须得可以呀
1 $(document).ready(function() { 2 //绑定新增按钮 3 $("#add_btn").click(function(e){ 4 addOrUpdate('0');//新增 5 }); 6 //绑定修改按钮 7 $("#update_btn").click(function(e){ 8 addOrUpdate('1');//修改 9 }); 10 //绑定删除按钮 11 $("#del_btn").click(function(e){ 12 deletePlan(); 13 }); 14 15 }); 16 17 //新增 18 function addOrUpdate(type) { 19 20 var title = ''; 21 var guid = ''; 22 if(type=='0'){//新增 23 title = '新增执法计划'; 24 }else{ 25 title = '修改执法计划'; 26 var selectedRows = planGrid.fnGetSelected(); 27 if (selectedRows != null && selectedRows.length != 1) { 28 layer.msg("请选择一条执法计划!", {icon: 0}); 29 return; 30 } 31 guid = selectedRows[0].guid; 32 } 33 layer.open({ 34 type: 2, 35 title: title, 36 content:"${ctx}gtPatrolPlan/addOrUpdate.html?guid="+guid, 37 area:["550px","600px"], 38 shadeClose:true, 39 maxmin:true 40 }); 41 } 42 //删除 43 function deletePlan() { 44 var selectedRows = planGrid.fnGetSelected(); 45 var ids = ""; 46 if (selectedRows == null || selectedRows.length == 0) { 47 layer.msg("请选择要删除的角色!", {icon: 0}); 48 } else{ 49 layer.confirm('确定要删除所选记录？', {icon: 3, title:'提示'}, function(index){ 50 for(var i=0, len = selectedRows.length; i < len; i++){ 51 ids += selectedRows[i].guid; 52 if(i != selectedRows.length - 1){ 53 ids += ","; 54 } 55 } 56 $.ajax({ 57 async : true, 58 cache : false, 59 url : "${ctx}gtPatrolPlan/delete.html", 60 data : { 61 "ids" : ids 62 }, 63 dataType : "json", 64 type : "post", 65 success : function(data) { 66 if (data.flag == "true") { 67 layer.msg("删除成功!", {icon: 1}); 68 planGrid.reload(); 69 } else { 70 layer.msg("删除失败!", {icon: 2}); 71 } 72 }, 73 error : function(data) { 74 layer.msg("网络故障!", {icon: 0}); 75 } 76 }); 77 //layer.close(index); 78 }); 79 } 80 }
请问以这段代码为例的话，应该怎么修改呢？能否给一个实例，实在是不知道怎么写了，
主要是哪些写在模块里，然后传参怎么传，谢谢
@mx夕酉:
comm:
exports.delete=function(table,id){}
list page:
var comm=require('comm')
delete btn:comm.delete
insert btn:comm.insert
@calvinK: 没有看懂 但还是谢谢
0
不知道你想要的是不是这样：
定义一些公用方法，需要时直接调用模块传参。
我大概写了一下。
HTML
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>demo</title> 6 </head> 7 <body> 8 <script data-main="./main" src="./require.min.js" defer 9 async="true"></script> 10 </body> 11 </html>
main.js
1 require.config({ 2 baseUrl: './', 3 paths: { 4 'app': 'app', 5 'demo': 'demo' 6 }, 7 shim: { 8 'demo': ['app'] 9 } 10 }) 11 require(['app', 'demo'], function($) { 12 13 })
app.js为公用方法类
1 define([], function() { 2 3 var service = {}; 4 5 service.add = function(msg) { 6 console.log(msg) 7 } 8 service.del = function() { 9 console.log('del') 10 } 11 12 return service; 13 });
然后在demo.js中调用app.js中的方法
1 define(['app'], function(app) { 2 console.log(app.add("Hello World")) 3 })
不知道你是不是想这样。
谢谢，想法是这样的。但是实际操作遇到问题，在demo.js中用到ztree树，删除之后要求刷新树列表，但是ztree相关写在demo.js里，，在app.js里删除之后无法调用demo.js里的函数，如果这样的话要怎样能够刷新ztree?
//app.js define(['jquery','ClearForm','appDept'],function($,appDept){ function demo(ids){ $.ajax({ async : true, cache : false, url : baseUrl+"gtDept/delete.html", data : {"ids" :ids}, dataType : "json", type : "post", success : function(data) { if (data.flag == "true") { layer.msg("删除成功!", {icon: 1}); appDept.queryDeptTreeWithoutRoot();//ztree // clear_form(); } else { layer.msg("删除失败!", {icon: 2}); } }, error : function(data) { layer.msg("网络故障!", {icon: 0}); } }); } return{ demo:demo } })
部分demo.js
var setting = null;
var treeObj = null;
var deptId;
$(document).ready(function() {
/*加载公司部门树*/
setting = {
async : {
enable : true,
url : baseUrl+'gtDept/queryDeptTree.html?',
autoParam : ["id"]
},
data : { // 必须使用data
key : {
title : ""
},
simpleData : {
enable : true,
idKey : "id", // id编号命名 默认
pIdKey : "pId", // 父id编号命名 默认
rootPId : 0 // 用于修正根节点父节点数据，即 pIdKey 指定的属性值
}
},
view : {
selectedMulti : false //不允许多选
},
callback : {
onClick : function(event, treeId, treeNode, clickFlag) {
deptId = treeNode.id;
findDetails(deptId);
},
/*捕获异步加载出现异常错误的事件回调函数 和 成功的回调函数*/
onAsyncError : zTreeOnAsyncError,//onAsyncError和 onAsyncSuccess默认为null
onAsyncSuccess : function(event, treeId, treeNode, msg) {
}
}
};
/*异常错误的事件回调函数*/
function zTreeOnAsyncError(event, treeId, treeNode, XMLHttpRequest, textStatus, errorThrown) {
layer.msg("网络故障!", {icon: 0});
}
queryDeptTreeWithoutRoot();
});
function queryDeptTreeWithoutRoot() {
treeObj = $.fn.zTree.init($("#dept_tree"), setting);
}
/*删除*/ function deleteDept(id) { var nodes = treeObj.getSelectedNodes(); var ids = ""; // 需要删除的id if (nodes.length == 0) { layer.msg("请选择要删除的部门", {icon: 0}); }else{ layer.confirm('确定要删除该部门及其所有子部门吗？', {icon: 3, title:'提示'},
function(index){ for(var i=0; i < nodes.length; i++){ ids += nodes[i].id; if(i != nodes.length - 1){ ids += ","; } } /*common del*/ del.demo(ids); layer.close(index); }); } }
@mx夕酉: 你在app.js里引用demo.js模块的tree生成方法试试看咯。
@mx夕酉: 你仔细看看上面的demo,我觉得你这个完全是很好解决的。
@mx夕酉: 给app.js模块删除方法添加一个回调，应该就可以。
@坐忘松雪: thank you 已解决
0
在公共该方法中，原原来的刷新树方法弃用，重新在公共方法下单独写了一个删除节点方法
/*删除节点*/ function removeNodes() { /*获取组织机构树*/ var treeObj = $.fn.zTree.getZTreeObj("dept_tree"); /*选中节点*/ var nodes = treeObj.getSelectedNodes(); for (var i=0; i < nodes.length; i++) { /*删除选中的节点*/ treeObj.removeNode(nodes[i]); } }
