NSP

NSP 全称为 Nokit Server Pages 是一种类似 asp / php 的 Web 应用开发模式， NSP 支持 include 引用其它页面，也支持 master 母板页技术。

一般目录结构

根目录
│ web.json
│ app.js
├─layout
│     date.nsp
│     master.nsp
├─model
└─public
    │  index.nsp
    │  index.nsp.js
    └─style
         common.css

NSP 页面 (*.nsp) 基本介绍

<!-- 输出内容 -->
<p> <%= "输出内容" %> </p>
<!-- this 指向页面处理器，无处理器页面指向默认处理器对象 -->
<p> <%= this.context.request.formData("name") %> </p>

<!-- 循环 -->
<ul> 
<% $.each(this.list,function(i,item){ %>
    <li><%= item.name %></li>
<% }) %>
</ul>

<!-- 分支 -->
<% if(this.type=='a'){ %>
<span>a</span>
<% }else{ %>
<span>b</span>
<% } %>

<!-- 包含 -->
<% $.include("../layout/head.nsp") %>

<!-- 母板页 -->
<html>
...
<div> <% $.placeHolder("content1") %> </div>
...
<div> <% $.placeHolder("content2") %> </div>
...
</html>

<!-- 内容页 -->
<% $.master("./master.nsp") %>

<% $.placeBegin("content1") %>
<span>content1</span>
<% $.placeEnd() %>

<% $.placeBegin("content2") %>
<span>content2</span>
<% $.placeEnd() %>

NSP 页面处理器 (*.nsp.js) 基本介绍

//定义页面处理器类型
var IndexPresenter = module.exports = function() {};

//初始化方法，每次回发都将触发 init 方法
IndexPresenter.prototype.init = function() {
    var self = this;
    /*
    self.server //当前 server 实例
    self.context //当前请上下文对象
    self.request //同 context.request，请求对象
    self.response //同 context.response 响应对象
    self.context.request.queryData['name'] 可以获取 queryString 对应数据
    self.context.request.formData['name'] 可以获取 post 数据
    self.context.params("name") 可以获取客户端传过来的 queryString 或 formData
    self.context.request.cookie 获取来自客户的 cookie
    self.context.respone.cookie 向客户端发送 cookie
    se轩.context.session 访问 session 数据
    */
    self.name = 'Nokit NSP';
    //init（初始化）完成后，需要调用 ready 方法，通知初始化完成
    self.ready();
};

//默认方法，首次打开页面，会触发 load 方法
IndexPresenter.prototype.load = function() {
    var self = this;
    //由于 nokit 为异步处理，调用 self.render() 方法向浏览器呈现页面.
    //不要在 init 方法调用 self.render() 
    self.render();
};

//事件方法，可以绑定到页面中的 html 控件
IndexPresenter.prototype.add = function() {
    var self = this;
    var val = parseInt(self.numBox.val());
    self.numBox.val(++val);
    self.numBox.css("border","solid 1px red");
    self.render();
};

页面绑定

<!-- 绑定到处理器方法 -->
<input type="button" onclick="nsp.call('add')" value='add' />

共享元素，将普通 DOM 元素通过 "nsp-id" 声明为客户端和服务端的共享元素，便可以在客户端和服务端同时操作指定元素，并能在回发时保持状态，类似 Asp.NET 的 WebForms，但理念、原理又非常不同，NSP 共享元素非常轻量，更简洁易用。

<!-- 此元素可以在服务端和客户端同时访问 -->
<input type="text" value="hello" nsp-id='test' />

IndexPresenter.prototype.add = function() {
    var self = this;
    //服务端提供类 jQuery 的元素操作 API (兼容部分常用 jQUery API)
    self.test.val('你好'); 
    self.render();
};

NSP - nokitjs/nokit GitHub Wiki

NSP

⚠️ **GitHub.com Fallback** ⚠️

⚠️ GitHub.com Fallback ⚠️