声明式注解符主要是声明在类、类成员属性或者方法上。
Main
入口注解符,指定一个类中的静态方法为入口,每个类中只能声明一次。声明后会在执行时调用这个方法。
语法:@Main
class Human{
@Main
static main(){
//这个方法会自动调用,一般用于入口文件的初始化
}
}
Override
重写方法注解符,当子组件中的方法与父组件中的方法名相同时就需要用Override来表示重写父类方法,防止开发者无意间覆盖了父组件中的方法。
语法:@Override
Abstract
抽象注解符,声明一个类或者方法为抽象化,必须在子类中实现后才能使用。一般用在编写描述文件时。
语法:@Abstract
@Abstract
class Human{
}
Deprecated
弃用注解符,指定一个类或者类成员/属性已被弃用
语法:@Deprecated
DOMAttribute
属性透传注解符,指定一个组件中的属性是否可被组件消费。一般用在编写Web组件描述文件时,如果在组件中被消费了就不会应用到dom元素上。
语法:@DOMAttribute
declare class Input extends Component{
@DOMAttribute
value:string;
}
Alias
别名注解符,定义一个方法或者属性名为别名,实际引用是通过Alias定义的引用名。一般用在编写类型描述文件时。
语法:@Alias(realname)
参数 realname:实际引用的属性名。
declare class Input extends Component{
@Alias(value)
modelValue:string;
}
Embed
嵌入注解符,将一个资源文件内容嵌入到属性中。
语法:@Embed(path)
参数 path:要嵌入的资源路径。
class Input extends Component{
@Embed('asstes/icon.png')
private icon:string;
@Override
render(){
return <div><img src={icon} /></div>
}
}
Required
必传注解符,声明一个属性在使用时必须赋值。一般用在Web组件中。
语法:@Required
Reference
引用描述文件注解符,在一个描述文件中引用另一个描述文件。一般用于描述文件编写。
语法:@Reference(path)
Hook
勾子注解符,定义在一个类属性或者方法上。在编译阶段会把描述文件中定义的勾子函数提取出来并在运行时调用,来达到相互之间的兼容、转换、适配目的。一般用于不能对组件进行继承重写时。
语法:@Hook(HookName:string)
参数 HookName: 通过 System.registerHook 已注册的勾子名
//Verson1.vue
import {defineComponent} from 'vue'
export default defineComponent({
name:'Verson1',
props:{
size:{
type:'large' | 'medium' | 'small' | 'mini'
default='medium'
}
},
setup(){
//....
}
});
//Verson1.d.es
import web.components.Component;
import Verson1 from 'Verson1.vue';
declare class Verson1 extends Component{
@Hook('verson1.size')
size:'large' | 'medium' | 'small' | 'mini';
}
//注册一个勾子
System.registerHook('verson1.size',function(value, property, className){
if(value==='mini')return 'small'
return value;
},-500);
//在web组件中使用,此时Verson1.size属性值会替换成'small'
<Verson1 size='mini'/>
Provider
提供者注解符,表示在已实现的组件中为其提供数据访问的接口。常见的是在Web组件中,父组件为子组件提供数据访问与Injector配合使用。
Injector
注入注解符,注入一个已知提供者(Provider)的数据到此属性上。常见的是在Web组件中,相当于获取父组件通过Provider定义的属性。
//Parent.es
import web.components.Component;
class Parent extends Component{
@Provider
get list(){
return [1,2,3];
}
}
//Child.es
import web.components.Component;
class Child extends Component{
@Injector
private list = [];
@Override
protected onInitialized(){
console.log(this.list) // output: [1,2,3]
}
}
//使用
<Parent>
<Child />
</Parent>
Reactive
响应式注解符,只能声明在一个类成员属性上。常见的是在Web组件中,如果属性有变化则会发出通知和执行相应的流程。
import web.components.Component;
class Child extends Component{
@Reactive
private timer = 0;
@Override
protected onMounted(){
setInterval(()=>{
this.timer++;
},1000)
}
@Override
render(){
return <div>timer:{timer}</div>
}
}
Router
路由注解符,是Post,Get,Delete,Put,Option 的集合。声明在一个类或者类成员方法上。通常路由注解符用于API交互或者WEB页面类上。
注意:在类方法上声明路由注解符时那么对应的修饰符必须为public。如果在类上定义路由后就不能在类方法上再定义路由注解符,因为这样会产生冲突。
语法:@Router([path[=FullClassname]], [method[=get]])
参数 path:以 ‘/’开头表示完整路径,否则会在前面加上完整类名(含命名空间)。
参数 method:请求方法,默认为get。
package api.http;
class Index{
@Router('/index/list', method='get')
list(){
return response([1,2,3], 200)
}
@Post('/index/edit')
edit(id:number){
//todo ...
}
}
以上代码构建后以上会生成对应的路由文件,对应的路由文件格式是根据指定的转换插件来生成的。
下面是thinkphp语法插件生成的路由内容:
//route/app.php
<?php
declare (strict_types = 1);
use think\facade\Route;
Route::get('index/list$', '\app\http\Index@list');
Route::post('index/edit/:id$', '\app\http\Index@edit');
Post
路由注解符,指定为post请求方法。是Router的派生注解符。
语法:@Post([path[=methodName]])
Get
路由注解符,指定为get请求方法。是Router的派生注解符。
语法:@Get([path[=methodName]])
Delete
路由注解符,指定为delete请求方法。是Router的派生注解符。
语法:@Delete([path[=methodName]])
Put
路由注解符,指定为put请求方法。是Router的派生注解符。
语法:@Put([path[=methodName]])
Option
路由注解符,指定为option请求方法。是Router的派生注解符。
语法:@Option([path[=methodName]])
Define
定义分界注解符,在编译阶段为了区分类的种类所以需要定义不同的声明。一般用在编写类型描述文件时或者插件开发人员。
语法:@Define(type, value, […[name=value]])
参数 type: 标识符名称
参数 value: 标识符值
Runtime
构建策略注解符,声明类在指定的插件构建运行。非匹配的插件不会构建打包并在代码中移除。
语法:@Runtime(client|server)
参数: client 客户端构建,server 服务端构建
import web.components.Component;
@Runtime(client)
class Popup extends Component{
}
以上代码在构建时会判断插件的 plugin.platform 或者 plugin.options.metadata.platform 如果条件匹配则会构建运行,否则不会构建。
如果此类在代码块中有使用则会移除。