跳转到内容

注入属性脚本

注入属性是为指定部件成员绑定到组件的属性中,如日期选择编辑器使用的是el-date-picker组件,可添加注入属性type、format、valueFormat来控制编辑器组件显示类型。

参数

名称类型描述
contextIApiContext当前视图上下文
paramsIApiParams当前视图参数
dataIApiData当前业务数据
targetNamestring部件名称
viewIApiViewController当前视图
ctrlIApiControlController当前部件
documentDocument当前文档对象
selector(className: string) => HTMLCollectionOf<Element>元素选择器
envIEnvironment当前环境对象
appSessionIApiData当前应用会话对象
topViewSessionIApiData当前顶级视图会话对象
viewSessionIApiData当前视图会话对象
viewParamIApiParams
appIApiAppHubController当前应用
topViewIApiViewController当前顶级视图
parentViewIApiViewController | undefined当前父视图
parentIApiViewController | undefined当前父视图
util{ message: IApiMessageUtil, notification: IApiNotificationUtil,modal: IApiModalUtil,confirm: IApiConfirmUtil,openView: IApiOpenViewUtil}工具集

调用示例

时间范围选择判断该日期是否应该被禁用

typescript
// 通过元素审查可以发现时间范围选择器使用的是elementPlus组件中的DatePicker(日期选择器),通过设置disabledDate参数可以约束时间范围选择器的可选日期,接受一个 Date 对象作为参数。 应该返回一个 Boolean 值。因此注入属性名称为disabledDate,脚本内容如下所示:
(time) => {
  if (!data.end_at) {
    return false;
  }
  const end_at = new Date(data.end_at);
  time.setHours(0, 0, 0, 0);
  end_at.setHours(0, 0, 0, 0);
  return time.getTime() > end_at.getTime();
};

根据表单数据修改日期选择器显示类型

  • 修改el-date-picker的type属性(注入属性为type)
data.sjlx === 'YEAR' ? 'daterange' : 'monthrange'
  • 修改el-date-picker的format属性(注入属性为format)
data.sjlx === 'YEAR' ? 'YYYY-MM-DD' : 'YYYY-MM'
  • 修改el-date-picker的value-format属性(注入属性为valueFormat)
data.sjlx === 'YEAR' ? 'YYYY-MM-DD' : 'YYYY-MM'
未来已来,立即拥抱应用融合的力量
Released under the MIT License.