基于mysql单页应用框架_DamnsingleJS

#DamnsingleJS

一、简介

DamnsingleJS是一款适用于前端单页程序的MVC开发框架，这款框架借鉴了后端语言PHP的MVC理念，通过控制器和页面路由的绑定技术，使得控制器可以直接由路由的请求来进行执行和响应。

另外这款框架还有高便利性的数据绑定引擎，使得前端视图得以和后端数据高度绑定，大大减轻和节省了开发者的开发时间，大幅度提高开发效率，有的时候你只需要将前端视图编写完毕，数据即可输出到视图中，甚至不需要开发者编写逻辑代码。

二、简单入门教程

首先在你的单页面(index.html)的body标签结束之前引入：

如果有模块，请在引入DamnsingleJS之前先引入所需的模块，像这样：

然后你需要把页面的body标签的ID指定为'App'，像这样：

以上操作完毕之后，你可以新建一个app.js作为单页应用的入口文件，像这样：

const App = new Damnsingle({

mainViewId: "App",

defaultControllerName: "Home/Index",

defaultTemplatesDir: "templates",

defaultControllersDir: "controllers",

relys: ['http', 'get'],

isRouteTracking: true,

init: function() {

}

});

App.controller(["Home", "Personal", ]);

其中，App 是你通过Damnsingle实例化之后的应用名，接下来的所有操作都是基于这个App对象。

现在，我们有了两个控制器，一个是 home ， 另外一个是 personal 。

controller 方法支持两种控制器的写法：

第一种：

App.controller(["Home", "Personal", ]);

这里，我们给controller方法传入了一个数组，这个数组包含了控制器的文件名，框架会自动去预先设定好的控制器目录中寻找数组中的控制器名，并且加载进来。

第二种：

App.controller({

Home: function() {

return {

Index: function() {

console.log('hi')

}

}

},

Personal: function() {

return {

Index: function() {}

}

}

第二种方法，直接给controller方法传入一个对象，这个对象里包含了控制器所有的方法和函数。

由于框架和路由是直接进行绑定的，我们可以直接在URL中访问对应的控制器中的方法：像这样：(注意区分大小写)

可以看到控制台中已经输出了'hi'：

是不是使用起来非常的简单。

三、实例化配置项详解

Options name

Data type

intro

mainViewId

String

主要操作页面中的哪一个容器，以ID作为标示。

defaultControllerName

String

默认路由，当路由为空时，框架将会执行的控制器或控制器的方法。

defaultTemplatesDir

String

模板目录，加载模板时框架会去此目录寻找模板文件。

defaultControllersDir

String

控制器目录，加载控制器时框架会去此目录寻找控制器文件。

relys

Array

声明依赖，框架会按照数组顺序依次加载依赖到框架中，可在框架中全局访问模块功能。

isRouteTracking

Boolean

是否支持首次路由加载

init

Function

初始化完毕之后的回调函数

以上参数均为必选参数。

四、框架自带API说明

Api Name

type

return

intro

T(Object)

Attr

无

加载模板

redirect(String)

Method

无

路由跳转

controller(null)

Method

无

定义控制器方法

GET

Attr

GET参数数组

获取URL中GET的参数，本身是一个对象。

http(String ,Object)

Method

无

发送一个Ajax同步请求，返回页面的输出内容。

五、一个简单的爬虫DEMO(从后端到前端)