mirror of
https://github.com/cq-panda/Vue.NetCore.git
synced 2026-10-28 21:53:17 +08:00
增加render操作文档
This commit is contained in:
jxx
@@ -84,7 +84,7 @@
|
||||
<br />
|
||||
|
||||
<div class="vol-demo">
|
||||
<VolHeader icon="md-apps" text="使用button编辑">
|
||||
<VolHeader icon="md-apps" text="使用button编辑,render动态渲染单元格">
|
||||
<div slot="content">通过button编辑与额外标签事件</div>
|
||||
</VolHeader>
|
||||
<vol-table
|
||||
@@ -357,12 +357,69 @@ let doc_options = {
|
||||
title: "测试3",
|
||||
width: 160
|
||||
},
|
||||
{
|
||||
field: "test4",
|
||||
title: "测试4",
|
||||
edit: { type: "datetime" },
|
||||
width: 250
|
||||
},
|
||||
{
|
||||
title: 'render动态生成组件', width: 165, render: (h, { row, column, index }) => {
|
||||
return h(
|
||||
"div",
|
||||
{ style: {} },
|
||||
[
|
||||
h(
|
||||
"Button",
|
||||
{
|
||||
props: { type: "success", size: "small" },
|
||||
style: {},
|
||||
on: {
|
||||
click: (e) => {
|
||||
e.stopPropagation()
|
||||
//弹出框编辑
|
||||
this.$Notice.open({
|
||||
title: '当前操作的行',
|
||||
desc: JSON.stringify(row)
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
"render按钮"
|
||||
),
|
||||
h(
|
||||
"Button",
|
||||
{
|
||||
props: { type: "info", size: "small" },
|
||||
style: { "margin-left": "10px" },
|
||||
on: {
|
||||
click: (e) => {
|
||||
e.stopPropagation()
|
||||
this.$Notice.open({
|
||||
title: '当前操作的行',
|
||||
desc: JSON.stringify(row)
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
"审核"
|
||||
),
|
||||
h(
|
||||
"Dropdown",
|
||||
{
|
||||
props: {
|
||||
transfer:true
|
||||
},
|
||||
style: {
|
||||
"margin-left": "10px"
|
||||
},
|
||||
on: {
|
||||
'on-click': (name) => {
|
||||
this.$Message.info(name);
|
||||
}
|
||||
}
|
||||
},
|
||||
[h('a', {}, ['更多', h('Icon', { props: { type: 'ios-arrow-down' } })]),
|
||||
h('DropdownMenu', { slot: "list" }, [h('DropdownItem', { props: { name: '明细' } }, '明细'), h('DropdownItem', { props: { name: '签收' } }, '签收'), h('DropdownItem', { props: { name: 'bubu..' } }, 'bubu..')])]
|
||||
)
|
||||
]
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
field: "test5",
|
||||
title: "测试5",
|
||||
@@ -484,4 +541,4 @@ export default doc_options;
|
||||
.keep-edit >>> .oper-btn {
|
||||
background-color: #19be6b;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -14,6 +14,7 @@ let param = {
|
||||
{ name: "[[{", desc: "表单字段formRules的参数配置说明", type: "", default: "" },
|
||||
{ name: "dataKey", desc: "数据源字典编号(菜单->系统->下拉框绑定中的字典编号)", type: "string", default: "" },
|
||||
{ name: "data", desc: "数据源，可以手动绑定格式[{key:1,value:'是'}],也可以自动绑定,自定绑定需要设置属性loadKey='true'", type: "array", default: "[]" },
|
||||
{ name: "render", desc: "<span style='color:red;'>支持vue原生render处理,[前端开发->render渲染form对象1/2]为配置示例，render完整用法见vue官方文档(2020.06.20)</span>", type: "function", default: "" },
|
||||
{ name: "title", desc: "标签名称", type: "string", default: "" },
|
||||
//
|
||||
{ name: "readonly/readonly", desc: "是否只读", type: "bool", default: "false" },
|
||||
@@ -94,6 +95,7 @@ let param = {
|
||||
{ name: "columns", desc: "table表参数配置", type: "array", default: "[]" },
|
||||
{ name: "{-----", desc: "-----columns属性介绍开始处-----", type: "-----", default: "-----" },
|
||||
{ name: "field", desc: "字段", type: "string", default: "" },
|
||||
{ name: "render", desc: "<span style='color:red;'>支持vue原生render处理,[前端开发->render渲染form对象1/2]为配置示例，render完整用法见vue官方文档(2020.06.20)</span>", type: "function", default: "" },
|
||||
{ name: "title", desc: "table列名", type: "string", default: "" },
|
||||
{ name: "width", desc: "列宽度", type: "number", default: "" },
|
||||
{ name: "sort", desc: "是否排序列", type: "bool", default: "false" },
|
||||
|
||||
@@ -44,6 +44,97 @@ export default {
|
||||
return {
|
||||
active: 0,
|
||||
log: [
|
||||
{
|
||||
date: "2020-06-20 02:17:52",
|
||||
desc:
|
||||
"增加volform、voltable对原生render的支持(现可任意扩展其他组件到form与table)"
|
||||
},
|
||||
{ date: "2020-06-20 00:44:33", desc: "优化首页、首页皮肤" },
|
||||
{
|
||||
date: "2020-06-17 16:19:18",
|
||||
desc: "修复增加pgsql后，代码生成器判断类型错误的问题"
|
||||
},
|
||||
{ date: "2020-06-16 09:50:17", desc: "增加登陆自动验证验证、UUID参数" },
|
||||
{
|
||||
date: "2020-06-16 09:45:54",
|
||||
desc: "重写登陆页面样式、增加登陆验证码、回车登陆"
|
||||
},
|
||||
{ date: "2020-06-15 18:59:30", desc: "增加Dapper事务封装及文档" },
|
||||
{
|
||||
date: "2020-06-15 13:30:41",
|
||||
desc: "修复Dapper使用DbTransaction后没有释放的问题"
|
||||
},
|
||||
{ date: "2020-06-14 21:53:33", desc: "增加pgsql脚本" },
|
||||
{
|
||||
date: "2020-06-14 21:52:17",
|
||||
desc: "增pgsql支持(生成代码获取表结构，同步表结构待完)"
|
||||
},
|
||||
{ date: "2020-06-14 17:30:48", desc: "Update appsettings.json" },
|
||||
{ date: "2020-06-14 16:38:58", desc: "增加对mysql数据类型double区分" },
|
||||
{
|
||||
date: "2020-06-14 16:12:12",
|
||||
desc:
|
||||
"增加代码生成器pgsql实体直实表名使用小写,dapper获取pgsql的NpgsqlConnection"
|
||||
},
|
||||
{ date: "2020-06-14 15:28:33", desc: "增加pgsql数据库配置" },
|
||||
{
|
||||
date: "2020-06-14 15:20:50",
|
||||
desc: "Merge pull request #81 from xuegaoge/master"
|
||||
},
|
||||
{ date: "2020-06-07 14:49:00", desc: "修复级联操作文档描述错误的问题" },
|
||||
{
|
||||
date: "2020-06-06 22:51:34",
|
||||
desc:
|
||||
"编辑表单类型selectList数据源为自定义sql并且key是数字时，强制转换成字符串"
|
||||
},
|
||||
{
|
||||
date: "2020-06-06 22:47:43",
|
||||
desc: "修改select编辑时手动级联文档说明"
|
||||
},
|
||||
{
|
||||
date: "2020-06-06 21:54:42",
|
||||
desc:
|
||||
"增加代码生成器文档，对select/selectList自定义sql数据源，在编辑时无法绑定默认值的问题说明"
|
||||
},
|
||||
{
|
||||
date: "2020-06-06 20:36:16",
|
||||
desc: "修复数据源为selectList时,key为数字0时不能转换文本的问题"
|
||||
},
|
||||
{
|
||||
date: "2020-06-06 20:02:51",
|
||||
desc: "修复单独使用table组件时,key为数字0时转换成文本失败的问题"
|
||||
},
|
||||
{
|
||||
date: "2020-06-03 14:03:18",
|
||||
desc: "增加voltabl文字对齐方式align（原生element table align属性）"
|
||||
},
|
||||
{
|
||||
date: "2020-06-03 13:43:26",
|
||||
desc: "优化路由切换加载状态，增加select手动级联文档"
|
||||
},
|
||||
{
|
||||
date: "2020-06-03 11:57:49",
|
||||
desc: "增加切换时路由加载提示(以前路由切换有明细卡顿现象)"
|
||||
},
|
||||
{ date: "2020-06-03 10:27:26", desc: "优化权限分配左侧tree固定宽度" },
|
||||
{
|
||||
date: "2020-06-02 14:52:55",
|
||||
desc: "修复首页关闭tabs时，可能关闭两个tabs的问题"
|
||||
},
|
||||
{
|
||||
date: "2020-06-02 14:39:17",
|
||||
desc: "修复使用表别名时读取不到配置信息"
|
||||
},
|
||||
{ date: "2020-06-01 13:22:21", desc: "增加http请求使用文档" },
|
||||
{
|
||||
date: "2020-06-01 13:16:58",
|
||||
desc: "增加[前端开发]级联文档与对象转换tree结构文档"
|
||||
},
|
||||
{ date: "2020-06-01 12:57:20", desc: "增加顶部导tabs超出后滚动" },
|
||||
{
|
||||
date: "2020-06-01 12:55:50",
|
||||
desc: "增加功能将普通对象转换为tree结构"
|
||||
},
|
||||
{
|
||||
date: "2020-05-31 23:15:20",
|
||||
desc:
|
||||
|
||||
@@ -374,6 +374,517 @@ export default {
|
||||
tips: ` this.columns数据源来源ViewGrid组件props.js属性(实际为App_Expert.Vue里columns)，edit/bind/onChange参数配置见VolTable组件文档`,
|
||||
img: "https://doc-vue-1256993465.cos.ap-chengdu.myqcloud.com/13.png"
|
||||
},
|
||||
{
|
||||
title: "render渲染table对象",
|
||||
content: [`<div style="color:#D4D4D4;background-color:#1E1E1E;font-family:Consolas, "font-size:14px;line-height:19px;white-space:pre;">
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">onInit</span>() {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//此处在table最后一列动态渲染组件，也可以在this.columns.splice(index,1,{})指定位置渲染</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">// render操作table组件，可以在单元格中添加任意组件，包括chart图表，具体render参数见vue官方文档</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">columns</span>.<span style="color:#dcdcaa;">push</span>({
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">title</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">'操作'</span>, <span style="color:#9cdcfe;">width</span><span style="color:#9cdcfe;">:</span> <span style="color:#b5cea8;">165</span>, <span style="color:#dcdcaa;">render</span><span style="color:#9cdcfe;">:</span> (<span style="color:#9cdcfe;">h</span>, { <span style="color:#9cdcfe;">row</span>, <span style="color:#9cdcfe;">column</span>, <span style="color:#9cdcfe;">index</span> }) <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#c586c0;">return</span> <span style="color:#dcdcaa;">h</span>(
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"div"</span>,
|
||||
</div>
|
||||
<div>
|
||||
{ <span style="color:#9cdcfe;">style</span><span style="color:#9cdcfe;">:</span> {} },
|
||||
</div>
|
||||
<div>
|
||||
[
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">h</span>(
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"Button"</span>,
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> { <span style="color:#9cdcfe;">type</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"success"</span>, <span style="color:#9cdcfe;">size</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"small"</span> },
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">style</span><span style="color:#9cdcfe;">:</span> {},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">on</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">click</span><span style="color:#9cdcfe;">:</span> (<span style="color:#9cdcfe;">e</span>) <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">e</span>.<span style="color:#dcdcaa;">stopPropagation</span>()
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//弹出框编辑</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#dcdcaa;">linkData</span>(<span style="color:#9cdcfe;">row</span>, <span style="color:#9cdcfe;">column</span>);
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"编辑"</span>
|
||||
</div>
|
||||
<div>
|
||||
),
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">h</span>(
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"Button"</span>,
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> { <span style="color:#9cdcfe;">type</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"info"</span>, <span style="color:#9cdcfe;">size</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"small"</span> },
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">style</span><span style="color:#9cdcfe;">:</span> { <span style="color:#ce9178;">"margin-left"</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"10px"</span> },
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">on</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">click</span><span style="color:#9cdcfe;">:</span> (<span style="color:#9cdcfe;">e</span>) <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">e</span>.<span style="color:#dcdcaa;">stopPropagation</span>()
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">$Notice</span>.<span style="color:#dcdcaa;">open</span>({
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">title</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">'当前操作的行'</span>,
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">desc</span><span style="color:#9cdcfe;">:</span> <span style="color:#9cdcfe;">JSON</span>.<span style="color:#dcdcaa;">stringify</span>(<span style="color:#9cdcfe;">row</span>)
|
||||
</div>
|
||||
<div>
|
||||
});
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"审核"</span>
|
||||
</div>
|
||||
<div>
|
||||
),
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">h</span>(
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"Dropdown"</span>,
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">style</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"margin-left"</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"10px"</span>
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">on</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">'on-click'</span><span style="color:#9cdcfe;">:</span> (<span style="color:#9cdcfe;">name</span>) <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">$Message</span>.<span style="color:#dcdcaa;">info</span>(<span style="color:#9cdcfe;">name</span>);
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
[<span style="color:#dcdcaa;">h</span>(<span style="color:#ce9178;">'a'</span>, {}, [<span style="color:#ce9178;">'更多'</span>, <span style="color:#dcdcaa;">h</span>(<span style="color:#ce9178;">'Icon'</span>, { <span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> { <span style="color:#9cdcfe;">type</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">'ios-arrow-down'</span> } })]),
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">h</span>(<span style="color:#ce9178;">'DropdownMenu'</span>, { <span style="color:#9cdcfe;">slot</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"list"</span> }, [<span style="color:#dcdcaa;">h</span>(<span style="color:#ce9178;">'DropdownItem'</span>, { <span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> { <span style="color:#9cdcfe;">name</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">'明细'</span> } }, <span style="color:#ce9178;">'明细'</span>), <span style="color:#dcdcaa;">h</span>(<span style="color:#ce9178;">'DropdownItem'</span>, { <span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> { <span style="color:#9cdcfe;">name</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">'签收'</span> } }, <span style="color:#ce9178;">'签收'</span>), <span style="color:#dcdcaa;">h</span>(<span style="color:#ce9178;">'DropdownItem'</span>, { <span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> { <span style="color:#9cdcfe;">name</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">'bubu..'</span> } }, <span style="color:#ce9178;">'bubu..'</span>)])]
|
||||
</div>
|
||||
<div>
|
||||
)
|
||||
</div>
|
||||
<div>
|
||||
]
|
||||
</div>
|
||||
<div>
|
||||
);
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
})
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
</div>`],
|
||||
tips: ` render操作table组件，可以在单元格中添加任意组件，包括chart图表，具体render参数见vue官方文档`,
|
||||
img: "https://doc-vue-1256993465.cos.ap-chengdu.myqcloud.com/16.png"
|
||||
},
|
||||
|
||||
{
|
||||
title: "render渲染form对象1",
|
||||
content: [`<div style="color:#D4D4D4;background-color:#1E1E1E;font-family:Consolas, "font-size:14px;line-height:19px;white-space:pre;">
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">onInit</span>() {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//在编辑框第三行数据后动态加添其他组件</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//render操作form组件，可以在表单中添加任意组件，包括chart图表，具体render参数见vue官方文档</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">editFormOptions</span>.<span style="color:#dcdcaa;">splice</span>(<span style="color:#b5cea8;">2</span>, <span style="color:#b5cea8;">0</span>, [
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">colSize</span><span style="color:#9cdcfe;">:</span> <span style="color:#b5cea8;">12</span>,
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">render</span><span style="color:#9cdcfe;">:</span> <span style="color:#9cdcfe;">h</span> <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#c586c0;">return</span> <span style="color:#dcdcaa;">h</span>(
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"Alert"</span>,
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> {},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">style</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"margin-left"</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"100px"</span>,
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"background-color"</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"#f0faff"</span>,
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"margin-top"</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"-14px"</span>
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">on</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">click</span><span style="color:#9cdcfe;">:</span> () <span style="color:#569cd6;">=></span> { }
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
[
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"Alert Content"</span>,
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">h</span>(
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"div"</span>,
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> {},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">slot</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"desc"</span>,
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">style</span><span style="color:#9cdcfe;">:</span> {},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">on</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">click</span><span style="color:#9cdcfe;">:</span> () <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">$Notice</span>.<span style="color:#dcdcaa;">open</span>({
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">title</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">'Notification title'</span>,
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">desc</span><span style="color:#9cdcfe;">:</span> (<span style="color:#9cdcfe;">JSON</span>.<span style="color:#dcdcaa;">stringify</span>(<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">editFormFileds</span>))
|
||||
</div>
|
||||
<div>
|
||||
})
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
[<span style="color:#ce9178;">"这里是Alert内容(由render动态渲染)"</span>]
|
||||
</div>
|
||||
<div>
|
||||
)
|
||||
</div>
|
||||
<div>
|
||||
]
|
||||
</div>
|
||||
<div>
|
||||
);
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
])
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
</div>`],
|
||||
tips: `render操作form组件，可以在表单中添加任意组件，包括chart图表，具体render参数见vue官方文档`,
|
||||
img: "https://doc-vue-1256993465.cos.ap-chengdu.myqcloud.com/17.png"
|
||||
},
|
||||
{
|
||||
title: "render渲染form对象2",
|
||||
content: [`<div style="color:#D4D4D4;background-color:#1E1E1E;font-family:Consolas, "font-size:14px;line-height:19px;white-space:pre;">
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">onInit</span>() {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">$this</span> = <span style="color:#569cd6;">this</span>;
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//将编辑框第2行第2列替换成自定义组件，</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//也可以写成this.editFormOptions[index].push({})进行追加组件</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//render操作form组件，可以在表单中添加任意组件，包括chart图表，具体render参数见vue官方文档</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">editFormOptions</span>[<span style="color:#b5cea8;">1</span>][<span style="color:#b5cea8;">1</span>] = {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">colSize</span><span style="color:#9cdcfe;">:</span> <span style="color:#b5cea8;">6</span>,
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">render</span><span style="color:#9cdcfe;">:</span> <span style="color:#9cdcfe;">h</span> <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#c586c0;">return</span> <span style="color:#dcdcaa;">h</span>(
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"div"</span>,
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">style</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"margin-left"</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"28px"</span>,
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"line-height"</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"34px"</span>
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
[
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">h</span>(
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"Button"</span>,
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">type</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"primary"</span>
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">style</span><span style="color:#9cdcfe;">:</span> {},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">on</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">click</span><span style="color:#9cdcfe;">:</span> () <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">$Message</span>.<span style="color:#dcdcaa;">info</span>(<span style="color:#9cdcfe;">JSON</span>.<span style="color:#dcdcaa;">stringify</span>(<span style="color:#9cdcfe;">$this</span>.<span style="color:#9cdcfe;">editFormFileds</span>));
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"render(获取表单值)"</span>
|
||||
</div>
|
||||
<div>
|
||||
),
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">h</span>(
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"Button"</span>,
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">props</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">type</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"error"</span>
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">style</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"margin-left"</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"10px"</span>
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">on</span><span style="color:#9cdcfe;">:</span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">click</span><span style="color:#9cdcfe;">:</span> () <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">$this</span>.<span style="color:#dcdcaa;">resetEdit</span>();
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">$Message</span>.<span style="color:#dcdcaa;">info</span>(<span style="color:#ce9178;">'表单已重置'</span>);
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#ce9178;">"render(重置表单)"</span>
|
||||
</div>
|
||||
<div>
|
||||
)
|
||||
</div>
|
||||
<div>
|
||||
]
|
||||
</div>
|
||||
<div>
|
||||
);
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
</div>`],
|
||||
tips: `render操作form组件，可以在表单中添加任意组件，包括chart图表，具体render参数见vue官方文档`,
|
||||
img: "https://doc-vue-1256993465.cos.ap-chengdu.myqcloud.com/18.png"
|
||||
},
|
||||
{
|
||||
title: "格式化table的数据",
|
||||
content: [
|
||||
@@ -532,7 +1043,7 @@ export default {
|
||||
<span style="color:#c586c0;">if</span> (<span style="color:#9cdcfe;">column</span>.<span style="color:#9cdcfe;">field</span> == <span style="color:#ce9178;">'CreateDate'</span>) {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">x</span>.<span style="color:#9cdcfe;">hidden</span>=<span style="color:#569cd6;">true</span>;
|
||||
<span style="color:#9cdcfe;">column</span>.<span style="color:#9cdcfe;">hidden</span>=<span style="color:#569cd6;">true</span>;
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
@@ -1279,129 +1790,122 @@ export default {
|
||||
},
|
||||
{
|
||||
title: "select手动触发级联",
|
||||
content: [`<div style="color:#D4D4D4;background-color:#1E1E1E;font-family:Consolas, "font-size:14px;line-height:19px;white-space:pre;">
|
||||
content: [`<p>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">onInit</span>() {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//设置表单的默认值,没有值就设置为空数组(必须)</span>
|
||||
</div>
|
||||
<div><div style="color:#D4D4D4;background-color:#1E1E1E;font-family:Consolas, "font-size:14px;line-height:19px;white-space:pre;">
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">getOption</span>(<span style="color:#9cdcfe;">field</span>) {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">option</span>;
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">editFormOptions</span>.<span style="color:#dcdcaa;">forEach</span>(<span style="color:#9cdcfe;">x</span> <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">x</span>.<span style="color:#dcdcaa;">forEach</span>(<span style="color:#9cdcfe;">item</span> <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#c586c0;">if</span> (<span style="color:#9cdcfe;">item</span>.<span style="color:#9cdcfe;">field</span> == <span style="color:#9cdcfe;">field</span>) {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">option</span> = <span style="color:#9cdcfe;">item</span>;
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
})
|
||||
</div>
|
||||
<div>
|
||||
})
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#c586c0;">return</span> <span style="color:#9cdcfe;">option</span>;
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">async</span> <span style="color:#dcdcaa;">onInit</span>() {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">/*从editFormOptions获取代码生成的配置参数*/</span>
|
||||
</div>
|
||||
<div style="color:#D4D4D4;background-color:#1E1E1E;font-family:Consolas, "font-size:14px;line-height:19px;white-space:pre;">
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">getOption</span>(<span style="color:#9cdcfe;">field</span>) {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">option</span>;
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">editFormOptions</span>.<span style="color:#dcdcaa;">forEach</span>(<span style="color:#9cdcfe;">x</span> <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">x</span>.<span style="color:#dcdcaa;">forEach</span>(<span style="color:#9cdcfe;">item</span> <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#c586c0;">if</span> (<span style="color:#9cdcfe;">item</span>.<span style="color:#9cdcfe;">field</span> == <span style="color:#9cdcfe;">field</span>) {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">option</span> = <span style="color:#9cdcfe;">item</span>;
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
})
|
||||
</div>
|
||||
<div>
|
||||
})
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#c586c0;">return</span> <span style="color:#9cdcfe;">option</span>;
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#dcdcaa;">onInit</span>() {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">/*从editFormOptions获取代码生成的配置参数*/</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">/*getOption实际是获取volform的配置信息，详情配置看volform组件*/</span>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<span style="color:#6a9955;">//获取select【地区】配置</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">select1</span> = <span style="color:#569cd6;">this</span>.<span style="color:#dcdcaa;">getOption</span>(<span style="color:#ce9178;">"City"</span>);
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//获取select【是否启用】配置</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">select2</span> = <span style="color:#569cd6;">this</span>.<span style="color:#dcdcaa;">getOption</span>(<span style="color:#ce9178;">"Enable"</span>);
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//获取个人简介配置</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">textare</span> = <span style="color:#569cd6;">this</span>.<span style="color:#dcdcaa;">getOption</span>(<span style="color:#ce9178;">"Resume"</span>);
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">/*getOption实际是获取volform的配置信息，详情配置看volform组件*/</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//获取select【地区】配置</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">select1</span> = <span style="color:#569cd6;">this</span>.<span style="color:#dcdcaa;">getOption</span>(<span style="color:#ce9178;">"City"</span>);
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<span style="color:#6a9955;">//通过select1选择后，给select2重新绑定数据源与textare重新设置值</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">select1</span>.<span style="color:#dcdcaa;">onChange</span> = <span style="color:#569cd6;">async</span> (<span style="color:#9cdcfe;">val</span>, <span style="color:#9cdcfe;">option</span>) <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//清空select2的数据源</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">select2</span>.<span style="color:#9cdcfe;">data</span>.<span style="color:#dcdcaa;">splice</span>(<span style="color:#b5cea8;">0</span>);
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//选择select1时给select2重新绑定数据源</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">source</span> = [{ <span style="color:#9cdcfe;">key</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"1"</span>, <span style="color:#9cdcfe;">value</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"text1"</span> }, { <span style="color:#9cdcfe;">key</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"2"</span>, <span style="color:#9cdcfe;">value</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"text2"</span> }];
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//获取select【是否启用】配置</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">select2</span> = <span style="color:#569cd6;">this</span>.<span style="color:#dcdcaa;">getOption</span>(<span style="color:#ce9178;">"Enable"</span>);
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<span style="color:#6a9955;">//通过select1选择后，给select2重新绑定数据源与textare重新设置值</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">select1</span>.<span style="color:#dcdcaa;">onChange</span> = (<span style="color:#9cdcfe;">val</span>, <span style="color:#9cdcfe;">option</span>) <span style="color:#569cd6;">=></span> {
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//清空select2的数据源</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">select2</span>.<span style="color:#9cdcfe;">data</span>.<span style="color:#dcdcaa;">splice</span>(<span style="color:#b5cea8;">0</span>);
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//选择select1时给select2重新绑定数据源</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">let</span> <span style="color:#9cdcfe;">source</span> = [{ <span style="color:#9cdcfe;">key</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"1"</span>, <span style="color:#9cdcfe;">value</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"text1"</span> }, { <span style="color:#9cdcfe;">key</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"2"</span>, <span style="color:#9cdcfe;">value</span><span style="color:#9cdcfe;">:</span> <span style="color:#ce9178;">"text2"</span> }];
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//此处可以从后台返回数据源，格式见source配置</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//this.http.post("/api/App_Expert/getPageData", {}, true).then(source => {</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//清除表单已选中的值</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">editFormFileds</span>[<span style="color:#9cdcfe;">select2</span>.<span style="color:#9cdcfe;">field</span>] = <span style="color:#ce9178;">""</span>;
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">select2</span>.<span style="color:#9cdcfe;">data</span>.<span style="color:#dcdcaa;">push</span>(...<span style="color:#9cdcfe;">source</span>)
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//第一次onChange时，不给表单设置值就不会触发级联视图刷新?原因待排查</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">editFormFileds</span>[<span style="color:#9cdcfe;">select2</span>.<span style="color:#9cdcfe;">field</span>] = <span style="color:#9cdcfe;">source</span>.<span style="color:#9cdcfe;">length</span> > <span style="color:#b5cea8;">0</span> ? <span style="color:#9cdcfe;">source</span>[<span style="color:#b5cea8;">0</span>].<span style="color:#9cdcfe;">key</span> : <span style="color:#ce9178;">""</span>;
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">// })</span>
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<span style="color:#6a9955;">//多级级联同上操作即可seletxxxx.onChange</span>
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<span style="color:#6a9955;">/*注意如果是从后台返回要使用await同步请求,上面方法 async onInit()*/</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//此处可以从后台返回数据源，格式见source配置</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">// await this.http.post("", {}, true).then(source => {</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#9cdcfe;">select2</span>.<span style="color:#9cdcfe;">data</span>.<span style="color:#dcdcaa;">push</span>(...<span style="color:#9cdcfe;">source</span>)
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">// })</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//给select2表设置一个默认值(可以不用设置)</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">// this.editFormFileds.Enable = "1";</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#6a9955;">//给textare标签设置一个值</span>
|
||||
</div>
|
||||
<div>
|
||||
<span style="color:#569cd6;">this</span>.<span style="color:#9cdcfe;">editFormFileds</span>.<span style="color:#9cdcfe;">Resume</span> = <span style="color:#ce9178;">"选择["</span> + <span style="color:#9cdcfe;">val</span> + <span style="color:#ce9178;">"]后设置的值"</span>;
|
||||
</div>
|
||||
<div>
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
},
|
||||
</div>
|
||||
</div>`],
|
||||
</p>`],
|
||||
tips: `select选择后给字段设置值或数据源，实现手动级联操作`,
|
||||
img: "https://doc-vue-1256993465.cos.ap-chengdu.myqcloud.com/15.png"
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user