# 软件介绍

houdunren

HDJS是为了方便前台工作框架内部集成了常用的前台开发组件,使用前台组件化管理,可以大大节省开发工作。

问题反馈

大家好我是HDJS与HDCMS作者来自 houdunren.com

希望大家发送建议给我们, 共同提高框架的品质。

邮箱: 2300071698@qq.com QQ : 2300071698

# 安装配置

下载软件

git clone https://github.com/houdunwang/hdjs

软件配置

<meta name="csrf-token" content="{{csrf_token()}}">
<link href="https://cdn.bootcss.com/twitter-bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet">

<script>
    window.hdjs={
        //组件目录必须绝对路径
        base : '/hdjs',
        //上传文件后台地址
        uploader : '/uploader.php?',
        //获取文件列表的后台地址
        filesLists : '/filesLists.php?',
        //require.js配置项(可为空)
        requireJs:{paths:{},shim:{}},
    };
</script>
<script src="hdjs/require.js"></script>
<script src="hdjs/config.js"></script>

如果在HDPHP、Laravel等框架中使用组件,需要在

标签中添加以下代码,这样可以实现框架的CSRF表单令牌验证。

<meta name="csrf-token" content="{{csrf_token()}}">

# 组件开发

系统提供了很多组件,有时我们在开发中根据自身业务要添加自己的功能组件,比如购物车管理等,如果hdjs在webpack中使用,那么我们可以使用es6或amd方式定义,这里就不进行说明了。如果在页面中使用require.js管理,定义方法如下。

# 定义组件

下面我们定义一个组件 js/test.js 。

<script>
define(['hdjs'], function (hdjs) {
	return {
    	name:'这是属性',
        //下面是方法定义
    	func1:function(){
        	return 'func1';
        },
        func2:function(){
        	return 'func2';
        }
    }
});
</script>

第一个数组参数是你这个组件依赖的其他组件,也就是说我们在组件中可以使用已经存在的hdjs组件。

# 使用自定义组件

使用自定义组件只要路径填对就可以直接使用和使用hdjs组件一样的。比如上面的组件我们定义在了网站根目录下 js/test.js目录中,使用方法如下:

<script>
require(['js/test.js'],function(test){
	alert(test.func1());
})
</script>