{"id":3913,"date":"2024-01-23T21:44:45","date_gmt":"2024-01-23T13:44:45","guid":{"rendered":"http:\/\/www.ponybai.com\/?p=3913"},"modified":"2023-12-03T08:04:34","modified_gmt":"2023-12-03T00:04:34","slug":"%e5%9c%a8-flow-builder-%e4%b8%ad%e8%87%aa%e5%ae%9a%e4%b9%89%e6%93%8d%e4%bd%9c%e5%92%8c%e5%b1%8f%e5%b9%95%e7%bb%84%e4%bb%b6-ui","status":"publish","type":"post","link":"http:\/\/www.ponybai.com\/?p=3913","title":{"rendered":"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI"},"content":{"rendered":"\n

\u5f00\u53d1\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u4e2d\u914d\u7f6e\u81ea\u5b9a\u4e49\u5c4f\u5e55\u7ec4\u4ef6\u6216\u53ef\u8c03\u7528\u64cd\u4f5c\u65f6\uff0c\u8be5\u7f16\u8f91\u5668\u53ef\u4e3a\u5176\u63d0\u4f9b\u7b80\u5316\u7684 UI\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u662f\u4e00\u4e2a Lightning Web \u7ec4\u4ef6\uff0c\u5b83\u63d0\u4f9b\u7528\u4e8e\u8f93\u5165\u8f93\u5165\u503c\u7684\u81ea\u5b9a\u4e49 UI\u3002<\/p>\n\n\n\n

\u5c06\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e0e\u6807\u51c6\u5c5e\u6027\u7f16\u8f91\u5668\u8fdb\u884c\u6bd4\u8f83<\/h2>\n\n\n\n

\u5982\u679c\u6ca1\u6709\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u4e2d\u914d\u7f6e\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\u6216\u53ef\u8c03\u7528\u64cd\u4f5c\u65f6\uff0cUI \u7531\u7ec4\u4ef6\u8f93\u5165\u503c\u7684\u6587\u672c\u6846\u6216\u7ec4\u5408\u6846\u7ec4\u6210\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684 UI \u53ef\u4ee5\u7531\u4efb\u4f55\u8f93\u5165\u7ec4\u4ef6\u7ec4\u6210\uff0c\u5e76\u4e14\u53ef\u4ee5\u4f7f\u7528\u81ea\u5b9a\u4e49\u6837\u5f0f\u3002\u6b64\u793a\u4f8b\u663e\u793a\u4e86\u4e00\u4e2a\u6ca1\u6709\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\u3002\u8be5\u7ec4\u4ef6\u663e\u793a\u5c06\u6570\u636e\u4f20\u9012\u5230\u6d41\u4e2d\u7684\u8f93\u5165\u5c5e\u6027\u7684\u6587\u672c\u6846\u548c\u7ec4\u5408\u6846\u3002<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

\u76f8\u53cd\uff0c\u8bf7\u521b\u5efa\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u4e3a\u7ba1\u7406\u5458\u63d0\u4f9b\u7b80\u5316\u7684\u4f53\u9a8c\u3002\u6b64\u793a\u4f8b\u663e\u793a\u4e86\u4e00\u4e2a\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\uff0c\u8be5\u7ec4\u4ef6\u5177\u6709\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u8be5\u7f16\u8f91\u5668\u4f7f\u7528\u81ea\u5b9a\u4e49\u6807\u7b7e\u548c\u6ed1\u5757\u7ec4\u4ef6\u4f5c\u4e3a\u8f93\u5165\u503c\u3002<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

<\/p>\n\n\n\n

\u793a\u4f8b\uff1a\u53ef\u8c03\u7528\u64cd\u4f5c\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668<\/h2>\n\n\n\n

\u6b64\u793a\u4f8b\u521b\u5efa\u4e00\u4e2a\u53ef\u8c03\u7528\u64cd\u4f5c\u53ca\u5176\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002\u5728 Flow Builder \u4e2d\uff0c\u7ba1\u7406\u5458\u4e3a\u201c\u53d1\u9001 HTML \u7535\u5b50\u90ae\u4ef6\u201d\u53ef\u8c03\u7528\u64cd\u4f5c\u8bbe\u7f6e\u8f93\u5165\u503c\u3002\u5f53\u7528\u6237\u8fd0\u884c\u6d41\u65f6\uff0c\u53ef\u8c03\u7528\u64cd\u4f5c\u4f1a\u53d1\u9001\u7535\u5b50\u90ae\u4ef6\u3002<\/p>\n\n\n\n

\u6b64 Apex \u7c7b\u6587\u4ef6\u5b9a\u4e49\u4e86\u53ef\u4f5c\u4e3a\u53ef\u8c03\u7528\u64cd\u4f5c\u8fd0\u884c\u7684\u65b9\u6cd5\u53ca\u5176\u8f93\u5165\u53d8\u91cf\u3002\u6ce8\u91ca\u6807\u8bc6\u53ef\u4f5c\u4e3a\u53ef\u8c03\u7528\u64cd\u4f5c\u8fd0\u884c\u7684\u53ef\u8c03\u7528\u65b9\u6cd5\u3002\u6ce8\u91ca\u6807\u8bc6\u53ef\u8c03\u7528\u65b9\u6cd5\u4f7f\u7528\u7684\u53d8\u91cf\u3002sendEmails<\/code>@InvocableMethod<\/code>@InputVariable<\/code><\/p>\n\n\n\n

\u53ef\u8c03\u7528\u65b9\u6cd5\u5728\u4fee\u9970\u7b26\u4e2d\u6ce8\u518c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002\u9664\u975e\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u5426\u5219\u547d\u540d\u7a7a\u95f4\u3002\u5982\u679c\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u8bf7\u4f7f\u7528\u8be5\u547d\u540d\u7a7a\u95f4\u6ce8\u518c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002\u5728\u6b64\u793a\u4f8b\u4e2d\uff0c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684\u540d\u79f0\u4e3a \u3002configurationEditor<\/code>c<\/code>c-html-email-editor<\/code><\/p>\n\n\n\n

\/\/ HtmlEmailAction.cls\nglobal class HtmlEmailAction {\n    global class EmailActionRequest {\n        @InvocableVariable\n        global String senderName;\n\n        @InvocableVariable\n        global String replyToEmail;\n\n        @InvocableVariable\n        global String recipientName;\n\n        @InvocableVariable\n        global String sendToEmail;\n\n        @InvocableVariable\n        global String subject;\n\n        @InvocableVariable\n        global String htmlBody;\n    }\n\n    global class EmailActionResult {\n        @InvocableVariable\n        global Boolean isSuccess;\n\n        @InvocableVariable\n        global String errorMessage;\n    }\n\n    @InvocableMethod(label='Send HTML Email' configurationEditor='c-html-email-editor')\n    global static List<EmailActionResult> sendEmails(List<EmailActionRequest> requests) {\n        List<EmailActionResult> results = new List<EmailActionResult>();\n\n        for(EmailActionRequest request : requests){\n            results.add(sendEmail(request));\n        }\n\n        return results;\n    }\n\n    public static EmailActionResult sendEmail(EmailActionRequest request) {\n        Messaging.SingleEmailMessage mail = new Messaging.SingleEmailMessage();\n\n        String[] sendToEmail = new String[]{ request.sendToEmail };\n        mail.setToAddresses(sendToEmail);\n        mail.setSenderDisplayName(request.senderName);\n        mail.setReplyTo(request.replyToEmail);\n        mail.setSubject(request.subject);\n        mail.setHtmlBody(request.htmlBody);\n        mail.setOptOutPolicy('FILTER');\n\n        Messaging.SingleEmailMessage[] messages = new List<Messaging.SingleEmailMessage>();\n        messages.add(mail);\n\n        Messaging.SendEmailResult[] results = Messaging.sendEmail(messages);\n        EmailActionResult emailActionResult = new EmailActionResult();\n\n        for(Messaging.SendEmailResult result :results) {\n            if(result.IsSuccess()) {\n                emailActionResult.isSuccess = true;\n            } else {\n                emailActionResult.isSuccess = false;\n                Messaging.SendEmailError[] errors = result.getErrors();\n                if (errors.size() > 0 ){\n                    emailActionResult.errorMessage = errors[0].getMessage();\n                }\n            }\n        }\n\n        return emailActionResult;\n    }\n}<\/code><\/pre>\n\n\n\n
\u8fd9\u4e9b HTML\u3001CSS\u3001JavaScript \u548c\u914d\u7f6e\u6587\u4ef6\u5b9a\u4e49\u64cd\u4f5c\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002<\/p>\n\n\n\n
HTML \u6a21\u677f\u5b9a\u4e49 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684 UI\u3002<\/p>\n\n\n\n
<!--htmlEmailEditor.html-->\n<template>\n  <div class=\"slds-m-bottom_x-small\">\n    <h2 class=\"slds-text-heading_medium slds-p-around_xx-small lgc-bg-inverse\">\n      Sender Information\n    <\/h2>\n\n    <div class=\"slds-p-around_xx-small lgc-bg\">\n      <lightning-input\n        type=\"text\"\n        label=\"Sender Name\"\n        placeholder=\"Enter sender name here...\"\n        value={senderName}\n        onchange={handleSenderNameChange}\n      >\n      <\/lightning-input>\n\n      <lightning-input\n        type=\"email\"\n        label=\"Reply-To Email Address\"\n        placeholder=\"Enter reply-to email address here...\"\n        value={replyToEmail}\n        onchange={handleReplyToEmailChange}\n      >\n      <\/lightning-input>\n    <\/div>\n  <\/div>\n\n  <div class=\"slds-m-bottom_x-small\">\n    <h2 class=\"slds-text-heading_medium slds-p-around_xx-small lgc-bg-inverse\">\n      Recipient Information\n    <\/h2>\n\n    <div class=\"slds-p-around_xx-small lgc-bg\">\n      <lightning-input\n        type=\"text\"\n        label=\"Recipient Name\"\n        placeholder=\"Enter recipient name here...\"\n        value={recipientName}\n        onchange={handleRecipientNameChange}\n      >\n      <\/lightning-input>\n\n      <lightning-input\n        type=\"email\"\n        label=\"Send-To Email Address\"\n        placeholder=\"Enter send-to email address here...\"\n        value={sendToEmail}\n        onchange={handleSendToEmailChange}\n        required\n      >\n      <\/lightning-input>\n    <\/div>\n  <\/div>\n\n  <div class=\"slds-m-top_small\">\n    <h2 class=\"slds-text-heading_medium slds-p-around_xx-small lgc-bg-inverse\">Subject and Body<\/h2>\n\n    <div class=\"slds-p-around_xx-small lgc-bg\">\n      <lightning-input\n        type=\"text\"\n        label=\"Subject\"\n        placeholder=\"Enter subject here...\"\n        value={subject}\n        onchange={handleSubjectChange}\n      >\n      <\/lightning-input>\n\n      <div class=\"row\">\n        <lightning-textarea\n          name=\"body\"\n          label=\"HTML Body\"\n          placeholder=\"Enter html body here...\"\n          value={htmlBody}\n          onchange={handleHtmlBodyChange}\n        >\n        <\/lightning-textarea>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/template><\/code><\/pre>\n\n\n\n
\u6b64\u793a\u4f8b\u663e\u793a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668 UI\u3002<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u540e\uff0cJavaScript \u7c7b\u4f1a\u4ece Flow Builder \u63a5\u6536\u6d41\u5143\u6570\u636e\u7684\u526f\u672c\u3002\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u66f4\u6539\u503c\u65f6\uff0c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4f1a\u8c03\u5ea6\u4e00\u4e2a\u4e8b\u4ef6\u4ee5\u5c06\u66f4\u6539\u4f20\u64ad\u56de Flow Builder\u3002<\/p>\n\n\n\n
\u6ce8\u610f<\/p>\n\n\n\n
\u4f7f\u7528\u5c5e\u6027\u4ece\u6d41\u4e2d\u6355\u83b7\u6570\u636e\u3002\u4f7f\u7528\u4e8b\u4ef6\u5728\u8fd0\u884c\u65f6\u62a5\u544a\u5bf9\u6d41\u7684\u66f4\u6539\u3002@api<\/code><\/p>\n\n\n\n
\/\/ htmlEmailEditor.js\nimport { LightningElement, api } from \"lwc\";\nexport default class HtmlEmailEditor extends LightningElement {\n  @api\n  inputVariables;\n\n  get senderName() {\n    const param = this.inputVariables.find(({ name }) => name === \"senderName\");\n    return param && param.value;\n  }\n\n  get replyToEmail() {\n    const param = this.inputVariables.find(({ name }) => name === \"replyToEmail\");\n    return param && param.value;\n  }\n\n  get recipientName() {\n    const param = this.inputVariables.find(({ name }) => name === \"recipientName\");\n    return param && param.value;\n  }\n\n  get sendToEmail() {\n    const param = this.inputVariables.find(({ name }) => name === \"sendToEmail\");\n    return param && param.value;\n  }\n\n  get subject() {\n    const param = this.inputVariables.find(({ name }) => name === \"subject\");\n    return param && param.value;\n  }\n\n  get htmlBody() {\n    const param = this.inputVariables.find(({ name }) => name === \"htmlBody\");\n    return param && param.value;\n  }\n\n  @api validate() {\n    const validity = [];\n    if (\n      !this.isValidEmailAddress(this.sendToEmail) ||\n      !this.isValidEmailAddress(this.replyToEmail)\n    ) {\n      validity.push({\n        key: \"SendToAddress\",\n        errorString: \"You have entered an invalid email format.\",\n      });\n    }\n    return validity;\n  }\n\n  isValidEmailAddress(email) {\n    const emailRegex = \/^\\w+([\\.-]?\\w+)+@\\w+([\\.:]?\\w+)+(\\.[a-zA-Z0-9]{2,3})+$\/;\n    return emailRegex.test(email);\n  }\n\n  handleSenderNameChange(event) {\n    this.handleChange(event, \"senderName\");\n  }\n\n  handleReplyToEmailChange(event) {\n    this.handleChange(event, \"replyToEmail\");\n  }\n\n  handleRecipientNameChange(event) {\n    this.handleChange(event, \"recipientName\");\n  }\n\n  handleSendToEmailChange(event) {\n    this.handleChange(event, \"sendToEmail\");\n  }\n\n  handleSubjectChange(event) {\n    this.handleChange(event, \"subject\");\n  }\n\n  handleHtmlBodyChange(event) {\n    this.handleChange(event, \"htmlBody\");\n  }\n\n  handleChange(event, name) {\n    if (event && event.detail) {\n      const newValue = event.detail.value;\n      const valueChangedEvent = new CustomEvent(\"configuration_editor_input_value_changed\", {\n        bubbles: true,\n        cancelable: false,\n        composed: true,\n        detail: {\n          name,\n          newValue,\n          newValueDataType: \"String\",\n        },\n      });\n      this.dispatchEvent(valueChangedEvent);\n    }\n  }\n}<\/code><\/pre>\n\n\n\n
Flow Builder \u5177\u6709\u7528\u4e8e\u4e0e\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u8fdb\u884c\u901a\u4fe1\u7684\u00a0JavaScript \u63a5\u53e3\u3002\u6b64 JavaScript \u7c7b\u4f7f\u7528 \u548c \u63a5\u53e3\u3002inputVariablesvalidate<\/code><\/p>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u540e\uff0c\u4ece Flow Builder \u63a5\u6536\u53ef\u8c03\u7528\u64cd\u4f5c\u4e2d\u8f93\u5165\u53d8\u91cf\u7684\u503c\u3002inputVariables<\/code><\/p>\n\n\n\n
\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6bcf\u4e2a\u8f93\u5165\u53d8\u91cf\u7684\u540d\u79f0\u3001\u503c\u548c\u6570\u636e\u7c7b\u578b\u3002inputVariables<\/code><\/p>\n\n\n\n
[\n  {\n    name: \"senderName\",\n    value: \"Test Inc\",\n    valueDataType: \"String\",\n  },\n];<\/code><\/pre>\n\n\n\n
\u65b9\u6cd5\uff08\u5982 \u548c \uff09\u83b7\u53d6\u6bcf\u4e2a\u8f93\u5165\u53d8\u91cf\uff0c\u4ee5\u4fbf\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u4f7f\u7528\u3002get<\/code>get senderName()<\/code>get replyToEmail()<\/code>value<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u7684\u5c4f\u5e55\u7f16\u8f91\u5668 UI \u4e2d\u5355\u51fb\u201c\u5b8c\u6210<\/strong>\u201d\u65f6\uff0cFlow Builder \u4f1a\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8bc4\u4f30\u51fd\u6570\u3002\u5982\u679c\u51fd\u6570\u8fd4\u56de \u548c \u6570\u636e\u7ed3\u6784\uff0c\u5219\u5c4f\u5e55\u7f16\u8f91\u5668\u4f1a\u663e\u793a\u9519\u8bef\u6570\uff0c\u5e76\u963b\u6b62\u7ba1\u7406\u5458\u5728\u5c4f\u5e55\u7f16\u8f91\u5668\u4e2d\u4fdd\u5b58\u66f4\u6539\u3002validate<\/code>key<\/code>errorString<\/code><\/p>\n\n\n\n
\u6ce8\u610f<\/p>\n\n\n\n
Flow Builder \u4ec5\u663e\u793a\u9519\u8bef\u6570\u3002\u82e5\u8981\u663e\u793a\u9519\u8bef\u5b57\u7b26\u4e32\uff0c\u8bf7\u5728\u65b9\u6cd5\u4e2d\u7f16\u5199\u4ee3\u7801\u3002\u6709\u5173\u66f4\u591a\u4fe1\u606f\uff0c\u8bf7\u53c2\u89c1\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668 JavaScript \u63a5\u53e3\u3002validate<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8f93\u5165\u8f93\u5165\u503c\u65f6\uff0c\u8be5\u65b9\u6cd5\u4f1a\u5c06\u4e8b\u4ef6\u8c03\u5ea6\u5230 Flow Builder\u3002Flow Builder \u63a5\u6536\u4e8b\u4ef6\u5e76\u66f4\u65b0\u6d41\u4e2d\u7684\u503c\u3002handleChange<\/code>configuration_editor_input_value_changed<\/code><\/p>\n\n\n\n
\u4e0b\u9762\u662f \u7684\u914d\u7f6e\u6587\u4ef6\u3002htmlEmailEditor<\/code><\/p>\n\n\n\n
<!--htmlEmailEditor.js-meta.xml-->\n<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<LightningComponentBundle xmlns=\"http:\/\/soap.sforce.com\/2006\/04\/metadata\">\n    <apiVersion>49.0<\/apiVersion>\n    <!--isExposed can be true or false-->\n    <isExposed>true<\/isExposed>\n<\/LightningComponentBundle><\/code><\/pre>\n\n\n\n
\u793a\u4f8b\uff1a\u5c4f\u5e55\u7ec4\u4ef6\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668<\/h2>\n\n\n\n
\u6b64\u793a\u4f8b\u4e3a\u663e\u793a\u5377\u7684\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\u521b\u5efa\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002\u7ba1\u7406\u5458\u4f7f\u7528\u5377\u7ec4\u4ef6\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u7684\u6ed1\u5757\u8bbe\u7f6e\u5377\u3002\u5f53\u7528\u6237\u8fd0\u884c\u6d41\u7a0b\u65f6\uff0c\u6d41\u7a0b\u5c4f\u5e55\u4f1a\u663e\u793a\u7ba1\u7406\u5458\u8bbe\u7f6e\u7684\u97f3\u91cf\u7ea7\u522b\u3002<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u4ee5\u4e0b HTML\u3001JavaScript \u548c\u914d\u7f6e\u6587\u4ef6\u5b9a\u4e49\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\u3002volume<\/code><\/p>\n\n\n\n
<!--volume.html-->\n<template>\n  <div>\n    <h1 class=\"slds-text-heading_medium\">Volume<\/h1>\n  <\/div>\n\n  <div class=\"slds-p-top_xxx-small\">\n    <p>\n      Your selected volume is:\n      <lightning-formatted-number value={volume}><\/lightning-formatted-number>\n    <\/p>\n  <\/div>\n<\/template><\/code><\/pre>\n\n\n\n
JavaScript \u7c7b\u5b9a\u4e49\u4e00\u4e2a\u516c\u5171\u5c5e\u6027\u3002volume<\/code><\/p>\n\n\n\n
\/\/ volume.js\nimport { LightningElement, api } from \"lwc\";\n\nexport default class Volume extends LightningElement {\n  @api volume;\n}<\/code><\/pre>\n\n\n\n
\u8981\u5728 Flow Builder \u4e2d\u516c\u5f00\u516c\u5171\u5c5e\u6027\uff0c\u8bf7\u5728\u914d\u7f6e\u6587\u4ef6\u4e2d\u5b9a\u4e49\u5b83\uff1a\u3002\u8be5\u7279\u6027\u786e\u5b9a\u5c5e\u6027\u662f\u5426\u53ef\u4ee5\u63a5\u6536\u6765\u81ea\u6d41\u7684\u8f93\u5165\u3002\u672c\u793a\u4f8b\u4e2d\u4f7f\u7528\u7684\u9ed8\u8ba4\u503c\u4e3a \u3002\u82e5\u8981\u4f7f\u5c5e\u6027\u4ec5\u53ef\u7528\u4e8e\u8f93\u5165\u6216\u8f93\u51fa\uff0c\u8bf7\u5c06\u8be5\u7279\u6027\u8bbe\u7f6e\u4e3a \u6216 \u3002volume<\/code><property name=\"volume\" type=\"Integer\"\/><\/code>role<\/code>inputAndOutput<\/code>role<\/code>inputOnly<\/code>outputOnly<\/code><\/p>\n\n\n\n
\u5728\u914d\u7f6e\u6587\u4ef6\u4e2d\uff0c\u4f7f\u7528\u5c5e\u6027\u6ce8\u518c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff1a\u3002\u9664\u975e\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u5426\u5219\u8bf7\u4f7f\u7528\u547d\u540d\u7a7a\u95f4\u3002\u5982\u679c\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u8bf7\u4f7f\u7528\u8be5\u547d\u540d\u7a7a\u95f4\u3002configurationEditor<\/code><targetConfig targets=\"lightning__FlowScreen\" configurationEditor=\"c-volume-editor\"><\/code>c<\/code><\/p>\n\n\n\n
<!-- volume.js-meta.xml-->\n<LightningComponentBundle xmlns=\"http:\/\/soap.sforce.com\/2006\/04\/metadata\">\n  <apiVersion>49.0<\/apiVersion>\n  <isExposed>true<\/isExposed>\n  <targets>\n    <target>lightning__FlowScreen<\/target>\n  <\/targets>\n  <masterLabel>Volume<\/masterLabel>\n  <targetConfigs>\n    <targetConfig targets=\"lightning__FlowScreen\" configurationEditor=\"c-volume-editor\">\n      <property name=\"volume\" type=\"Integer\"\/>\n    <\/targetConfig>\n  <\/targetConfigs>\n<\/LightningComponentBundle><\/code><\/pre>\n\n\n\n
\u4ee5\u4e0b HTML\u3001JavaScript \u548c\u914d\u7f6e\u6587\u4ef6\u5b9a\u4e49\u7ec4\u4ef6\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002volume<\/code><\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684 HTML \u6a21\u677f\u5b9a\u4e49 UI\uff0c\u8be5 UI \u4f7f\u7528\u6ed1\u5757\u57fa\u7840 Lightning Web \u7ec4\u4ef6\u3002<\/p>\n\n\n\n
<!--volumeEditor.html-->\n<template>\n  <div class=\"slds-p-around_xx-small\">\n    <lightning-slider label=\"Volume\" step=\"10\" value={volume} onchange={handleChange}>\n    <\/lightning-slider>\n  <\/div>\n<\/template><\/code><\/pre>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u65f6\uff0c\u5176 JavaScript \u7c7b\u4f1a\u4ece Flow Builder \u63a5\u6536\u6d41\u5143\u6570\u636e\u7684\u526f\u672c\u3002\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8fdb\u884c\u66f4\u65b0\u65f6\uff0c\u5b83\u4f1a\u8c03\u5ea6\u4e00\u4e2a\u4e8b\u4ef6\u4ee5\u5c06\u66f4\u6539\u4f20\u64ad\u56de Flow Builder\u3002<\/p>\n\n\n\n
\u6ce8\u610f<\/p>\n\n\n\n
\u4f7f\u7528\u5c5e\u6027\u4ece\u6d41\u4e2d\u6355\u83b7\u6570\u636e\u3002\u4f7f\u7528\u4e8b\u4ef6\u5728\u8fd0\u884c\u65f6\u62a5\u544a\u5bf9\u6d41\u7684\u66f4\u6539\u3002@api<\/code><\/p>\n\n\n\n
\/\/ volumeEditor.js\nimport { LightningElement, api } from \"lwc\";\n\nexport default class VolumeEditor extends LightningElement {\n  _inputVariables = [];\n\n  @api\n  get inputVariables() {\n    return this._inputVariables;\n  }\n\n  \/\/ Set a field with the data that was stored from the flow.\n  \/\/ This data includes the public volume property of the custom volume\n  \/\/ component.\n  set inputVariables(variables) {\n    this._inputVariables = variables || [];\n  }\n\n  \/\/ Get the value of the volume input variable.\n  get volume() {\n    const param = this.inputVariables.find(({ name }) => name === \"volume\");\n    return param && param.value;\n  }\n\n  @api\n  validate() {\n    const volumeCmp = this.template.querySelector(\"lightning-slider\");\n    const validity = [];\n    if (this.volume < 0 || this.volume > 100) {\n      volumeCmp.setCustomValidity(\"The slider range is between 0 and 100.\");\n      validity.push({\n        key: \"Slider Range\",\n        errorString: \"The slider range is between 0 and 100.\",\n      });\n    } else {\n      volumeCmp.setCustomValidity(\"\");\n    }\n    volumeCmp.reportValidity();\n    return validity;\n  }\n\n  handleChange(event) {\n    if (event && event.detail) {\n      const newValue = event.detail.value;\n      const valueChangedEvent = new CustomEvent(\"configuration_editor_input_value_changed\", {\n        bubbles: true,\n        cancelable: false,\n        composed: true,\n        detail: {\n          name: \"volume\",\n          newValue,\n          newValueDataType: \"Number\",\n        },\n      });\n      this.dispatchEvent(valueChangedEvent);\n    }\n  }\n}<\/code><\/pre>\n\n\n\n
Flow Builder \u5177\u6709\u7528\u4e8e\u4e0e\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u8fdb\u884c\u901a\u4fe1\u7684\u00a0JavaScript \u63a5\u53e3\u3002\u6b64 JavaScript \u7c7b\u4f7f\u7528 \u548c \u63a5\u53e3\u3002inputVariablesvalidate<\/code><\/p>\n\n\n\n
\u6b64\u793a\u4f8b\u5b9a\u4e49\u4e86 \u7684 getter \u548c setter\u3002\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u65f6\uff0csetter \u4ece Flow Builder \u63a5\u6536\u5c4f\u5e55\u7ec4\u4ef6\u4e2d\u516c\u5171\u5c5e\u6027\u7684\u503c\u3002\u5728\u6b64\u793a\u4f8b\u4e2d\uff0c\u6211\u4eec\u4f7f\u7528\u5c06\u6d41\u5143\u6570\u636e\u5b58\u50a8\u5728\u5b57\u6bb5\u4e2d\u7684\u7ea6\u5b9a\uff0c\u4f46\u60a8\u53ef\u4ee5\u6839\u636e\u9700\u8981\u547d\u540d\u8be5\u5b57\u6bb5\u3002inputVariables<\/code>inputVariables<\/code>_inputVariables<\/code><\/p>\n\n\n\n
\u4e2d\u7684\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6bcf\u4e2a\u8f93\u5165\u53d8\u91cf\u7684\u540d\u79f0\u3001\u503c\u548c\u6570\u636e\u7c7b\u578b\u3002_inputVariables<\/code><\/p>\n\n\n\n
[\n  {\n    name: \"volume\",\n    value: \"10\",\n    valueDataType: \"Number\",\n  },\n];<\/code><\/pre>\n\n\n\n
\u8be5\u65b9\u6cd5\u83b7\u53d6\u7528\u4e8e\u5377 UI \u7684\u5c5e\u6027\u3002volume<\/code>value<\/code>volume<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u7684\u5c4f\u5e55\u7f16\u8f91\u5668 UI \u4e2d\u5355\u51fb\u201c\u5b8c\u6210<\/strong>\u201d\u65f6\uff0cFlow Builder \u4f1a\u8bc4\u4f30\u6bcf\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u7684\u51fd\u6570\u3002\u5982\u679c\u51fd\u6570\u8fd4\u56de \u548c \u6570\u636e\u7ed3\u6784\uff0c\u5219 Flow Builder \u4f1a\u663e\u793a\u9519\u8bef\u6570\uff0c\u5e76\u963b\u6b62\u7ba1\u7406\u5458\u5728\u5c4f\u5e55\u7f16\u8f91\u5668\u4e2d\u4fdd\u5b58\u66f4\u6539\u3002validate<\/code>key<\/code>errorString<\/code><\/p>\n\n\n\n
\u6ce8\u610f<\/p>\n\n\n\n
Flow Builder \u4ec5\u663e\u793a\u9519\u8bef\u6570\u3002\u82e5\u8981\u663e\u793a\u9519\u8bef\u5b57\u7b26\u4e32\uff0c\u8bf7\u7f16\u5199\u4ee3\u7801\u3002\u6b64\u793a\u4f8b\u4f7f\u7528\u7ec4\u4ef6\u7684\u51fd\u6570\u663e\u793a\u81ea\u5b9a\u4e49\u9519\u8bef\u6d88\u606f\u3002\u4f7f\u7528 interface \u65b9\u6cd5\u3002lightning-slider<\/code>setCustomValidity()<\/code>validate<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8f93\u5165 volume \u7684\u503c\u65f6\uff0c\u8be5\u65b9\u6cd5\u4f1a\u5c06\u4e8b\u4ef6\u8c03\u5ea6\u5230 Flow Builder\u3002Flow Builder \u63a5\u6536\u4e8b\u4ef6\u5e76\u66f4\u65b0\u6d41\u4e2d\u7684\u503c\u3002handleChange<\/code>configuration_editor_input_value_changed<\/code><\/p>\n\n\n\n
\u8fd9\u662f \u7684\u914d\u7f6e\u6587\u4ef6\u3002volumeEditor<\/code><\/p>\n\n\n\n
<!--volumeEditor.js-meta.xml-->\n<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<LightningComponentBundle xmlns=\"http:\/\/soap.sforce.com\/2006\/04\/metadata\">\n  <apiVersion>49.0<\/apiVersion>\n  <!--isExposed can be true or false-->\n  <isExposed>true<\/isExposed>\n<\/LightningComponentBundle><\/code><\/pre>\n\n\n\n
\u793a\u4f8b\uff1a\u53ef\u8c03\u7528\u64cd\u4f5c\u7684\u901a\u7528 SObject \u8f93\u5165<\/h2>\n\n\n\n
\u6b64\u793a\u4f8b\u4e3a\u4f7f\u7528\u6cdb\u578b sObject \u8f93\u5165\u53c2\u6570\u7684\u53ef\u8c03\u7528\u64cd\u4f5c\u521b\u5efa\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002\u53ef\u8c03\u7528\u64cd\u4f5c\u662f\u53ef\u4ee5\u6dfb\u52a0\u5230\u6d41\u7a0b\u4e2d\u7684 Apex \u65b9\u6cd5\u3002\u5728 Flow Builder \u4e2d\uff0c\u7ba1\u7406\u5458\u4f7f\u7528\u9009\u62e9\u5217\u8868\u5b57\u6bb5\u6765\u8bbe\u7f6e\u53ef\u8c03\u7528\u64cd\u4f5c\u7684\u8f93\u5165\u53c2\u6570\uff1a\u8bb0\u5f55\u53d8\u91cf\u7684\u5bf9\u8c61\u3001\u8bb0\u5f55\u53d8\u91cf\u548c\u7528\u4e8e\u5b58\u50a8\u8f93\u51fa\u7684\u5bf9\u8c61\u3002\u5f53\u7528\u6237\u8fd0\u884c\u6b64\u793a\u4f8b\u7684\u6d41\u65f6\uff0c\u53ef\u8c03\u7528\u64cd\u4f5c\u5c06\u5b58\u50a8\u8bb0\u5f55\u96c6\u5408\u4e2d\u7684\u7b2c\u4e00\u6761\u8bb0\u5f55\u3002<\/p>\n\n\n\n
\u6b64 Apex \u7c7b\u6587\u4ef6\u5b9a\u4e49\u4e86\u53ef\u4f5c\u4e3a\u53ef\u8c03\u7528\u64cd\u4f5c\u8fd0\u884c\u7684\u65b9\u6cd5\u53ca\u5176\u8f93\u5165\u53d8\u91cf\u3002\u6ce8\u91ca\u6807\u8bc6\u53ef\u4ee5\u4f5c\u4e3a\u53ef\u8c03\u7528\u64cd\u4f5c\u8fd0\u884c\u7684\u65b9\u6cd5\u3002\u6ce8\u91ca\u6807\u8bc6\u53ef\u8c03\u7528\u65b9\u6cd5\u4f7f\u7528\u7684\u53d8\u91cf\u3002selectRecord<\/code>@InvocableMethod<\/code>@InvocableVariable<\/code><\/p>\n\n\n\n
\u53ef\u8c03\u7528\u65b9\u6cd5\u5728\u4fee\u9970\u7b26\u4e2d\u6ce8\u518c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002\u9664\u975e\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u5426\u5219\u547d\u540d\u7a7a\u95f4\u3002\u5982\u679c\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u8bf7\u4f7f\u7528\u8be5\u547d\u540d\u7a7a\u95f4\u6ce8\u518c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002\u5728\u6b64\u793a\u4f8b\u4e2d\uff0c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684\u540d\u79f0\u4e3a \u3002configurationEditor<\/code>c<\/code>c-select-record-editor<\/code><\/p>\n\n\n\n
\/\/ SelectRecordAction.cls\npublic with sharing class SelectRecordAction {\n    @InvocableMethod(configurationEditor='c-select-record-editor')\n    public static List <Results> selectRecord(List<Requests> requestList) {\n        List<SObject> inputCollection = requestList[0].inputCollection;\n        \/\/Store the first input record for output\n        SObject outputMember = inputCollection[0];\n        Results response = new Results();\n        response.outputMember = outputMember;\n        List<Results> responseWrapper= new List<Results>();\n        responseWrapper.add(response);\n        return responseWrapper;\n    }\n\npublic class Requests {\n    @InvocableVariable(label='Object for Input' description='Records for Input')\n    public List<SObject> inputCollection;\n    }\n\npublic class Results {\n    @InvocableVariable(label='Object for Storing Output' description='Records for Output')\n    public SObject outputMember;\n    }\n}<\/code><\/pre>\n\n\n\n
\u8fd9\u4e9b HTML\u3001CSS\u3001JavaScript \u548c\u914d\u7f6e\u6587\u4ef6\u5b9a\u4e49\u64cd\u4f5c\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002<\/p>\n\n\n\n
HTML \u6a21\u677f\u5b9a\u4e49 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684 UI\u3002<\/p>\n\n\n\n
<!--selectRecordEditor.html-->\n<template>\n  <lightning-combobox\n    name=\"inputType\"\n    label=\"Object for Record Variable\"\n    value={inputType}\n    placeholder=\"Select object...\"\n    options={typeOptions}\n    onchange={handleInputTypeChange}\n  >\n  <\/lightning-combobox>\n\n  <lightning-combobox\n    name=\"outputType\"\n    label=\"Object for Storing Output\"\n    value={outputType}\n    placeholder=\"Select object...\"\n    options={typeOptions}\n    onchange={handleOutputTypeChange}\n  >\n  <\/lightning-combobox>\n\n  <lightning-combobox\n    name=\"inputValue\"\n    label=\"Record Variable\"\n    value={inputValue}\n    placeholder=\"Select record variable...\"\n    options={valueOptions}\n    onchange={handleValueChange}\n  >\n  <\/lightning-combobox>\n\n  <div class=\"slds-p-bottom_medium\"><\/div>\n<\/template><\/code><\/pre>\n\n\n\n
\u6b64\u793a\u4f8b\u663e\u793a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668 UI\u3002<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u540e\uff0cJavaScript \u7c7b\u4f1a\u4ece Flow Builder \u63a5\u6536\u6d41\u5143\u6570\u636e\u7684\u526f\u672c\u3002\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u66f4\u6539\u503c\u65f6\uff0c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4f1a\u8c03\u5ea6\u4e00\u4e2a\u4e8b\u4ef6\u4ee5\u5c06\u66f4\u6539\u4f20\u64ad\u56de Flow Builder\u3002<\/p>\n\n\n\n
\u6ce8\u610f<\/p>\n\n\n\n
\u4f7f\u7528\u5c5e\u6027\u4ece\u6d41\u4e2d\u6355\u83b7\u6570\u636e\u3002\u4f7f\u7528\u4e8b\u4ef6\u5728\u8fd0\u884c\u65f6\u62a5\u544a\u5bf9\u6d41\u7684\u66f4\u6539\u3002@api<\/code><\/p>\n\n\n\n
\/\/ selectRecordEditor.js\nimport { LightningElement, api } from \"lwc\";\n\nexport default class SelectRecordEditor extends LightningElement {\n  @api\n  inputVariables;\n\n  @api\n  genericTypeMappings;\n\n  @api\n  builderContext;\n\n  get inputValue() {\n    const param = this.inputVariables.find(({ name }) => name === \"inputCollection\");\n    return param && param.value;\n  }\n\n  get inputType() {\n    const type = this.genericTypeMappings.find(({ typeName }) => typeName === \"T__inputCollection\");\n    return type && type.typeValue;\n  }\n\n  get outputType() {\n    const type = this.genericTypeMappings.find(({ typeName }) => typeName === \"U__outputMember\");\n    return type && type.typeValue;\n  }\n\n  get typeOptions() {\n    return [\n      { label: \"Account\", value: \"Account\" },\n      { label: \"Case\", value: \"Case\" },\n      { label: \"Lead\", value: \"Lead\" },\n    ];\n  }\n\n  get valueOptions() {\n    const variables = this.builderContext.variables;\n    return variables.map(({ name }) => ({\n      label: name,\n      value: name,\n    }));\n  }\n\n  handleInputTypeChange(event) {\n    if (event && event.detail) {\n      const newValue = event.detail.value;\n      const typeChangedEvent = new CustomEvent(\n        \"configuration_editor_generic_type_mapping_changed\",\n        {\n          bubbles: true,\n          cancelable: false,\n          composed: true,\n          detail: {\n            typeName: \"T__inputCollection\",\n            typeValue: newValue,\n          },\n        },\n      );\n      this.dispatchEvent(typeChangedEvent);\n    }\n  }\n\n  handleOutputTypeChange(event) {\n    if (event && event.detail) {\n      const newValue = event.detail.value;\n      const typeChangedEvent = new CustomEvent(\n        \"configuration_editor_generic_type_mapping_changed\",\n        {\n          bubbles: true,\n          cancelable: false,\n          composed: true,\n          detail: {\n            typeName: \"U__outputMember\",\n            typeValue: newValue,\n          },\n        },\n      );\n      this.dispatchEvent(typeChangedEvent);\n    }\n  }\n\n  handleValueChange(event) {\n    if (event && event.detail) {\n      const newValue = event.detail.value;\n      const valueChangedEvent = new CustomEvent(\"configuration_editor_input_value_changed\", {\n        bubbles: true,\n        cancelable: false,\n        composed: true,\n        detail: {\n          name: \"inputCollection\",\n          newValue,\n          newValueDataType: \"reference\",\n        },\n      });\n      this.dispatchEvent(valueChangedEvent);\n    }\n  }\n}<\/code><\/pre>\n\n\n\n
Flow Builder \u5177\u6709\u7528\u4e8e\u4e0e\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u8fdb\u884c\u901a\u4fe1\u7684\u00a0JavaScript \u63a5\u53e3\u3002\u6b64 JavaScript \u7c7b\u4f7f\u7528 \u3001 \u548c \u63a5\u53e3\u3002inputVariablesbuilderContextgenericTypeMappings<\/code><\/p>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u540e\uff0c\u4ece Flow Builder \u63a5\u6536\u53ef\u8c03\u7528\u64cd\u4f5c\u4e2d\u8f93\u5165\u53d8\u91cf\u7684\u503c\u3002inputVariables<\/code><\/p>\n\n\n\n
\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6bcf\u4e2a\u8f93\u5165\u53d8\u91cf\u7684\u540d\u79f0\u3001\u503c\u548c\u6570\u636e\u7c7b\u578b\u3002inputVariables<\/code><\/p>\n\n\n\n
[\n  {\n    name: \"inputType\",\n    value: \"Account\",\n    valueDataType: \"Account\",\n  },\n];<\/code><\/pre>\n\n\n\n
\u8be5\u65b9\u6cd5\u83b7\u53d6\u6bcf\u4e2a\u8f93\u5165\u53d8\u91cf\u7684\u503c\uff0c\u4ee5\u4fbf\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u4f7f\u7528\u3002get inputValue()<\/code><\/p>\n\n\n\n
\u8be5\u63a5\u53e3\u63a5\u6536\u8f93\u5165\u53d8\u91cf\u7684\u503c\uff0c\u8fd9\u4e9b\u53d8\u91cf\u662f Flow Builder \u4e2d\u53ef\u8c03\u7528\u64cd\u4f5c\u4e2d\u7684\u901a\u7528 sObject \u6570\u636e\u7c7b\u578b\u3002genericTypeMappings<\/code><\/p>\n\n\n\n
\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6bcf\u4e2a\u8f93\u5165\u7684\u540d\u79f0\u548c\u503c\u3002\u5fc5\u987b\u4e0e\u4f7f\u7528\u65b9\u6cd5\u4e2d\u7684\u6ce8\u91ca\u5b9a\u4e49\u7684\u6cdb\u578b sObject \u8f93\u5165\u7684\u540d\u79f0\u5339\u914d\uff0c\u4f8b\u5982 \u3002 \u5728\u8f93\u5165\u540d\u79f0\u524d\u9762\u52a0\u4e0a\uff0c\u5e76\u81ea\u52a8\u5728\u8f93\u51fa\u540d\u79f0\u524d\u9762\u52a0\u4e0a\u3002\u662f\u901a\u7528 sObject \u8f93\u5165\u7684\u7279\u5b9a\u503c\uff0c\u4f8b\u5982 \u3002typeName<\/code>@InvocableVariable<\/code>\u2019T__inputCollection\u2019<\/code>T__<\/code>U__<\/code>typeValue<\/code>Account<\/code><\/p>\n\n\n\n
[\n  {\n    typeName: \"T__inputCollection\",\n    typeValue: \"Account\",\n  },\n];<\/code><\/pre>\n\n\n\n
\u548c\u65b9\u6cd5\u83b7\u53d6\u6bcf\u4e2a\u8f93\u5165\u53c2\u6570\u7684\u503c\uff0c\u8be5\u53c2\u6570\u662f\u7528\u4e8e\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684\u6cdb\u578b sObject \u6570\u636e\u7c7b\u578b\u3002get inputType()<\/code>get outputType()<\/code><\/p>\n\n\n\n
\u8be5\u65b9\u6cd5\u83b7\u53d6\u6bcf\u4e2a\u5bf9\u8c61\u8f93\u5165\u9009\u9879\u7684\u6807\u7b7e\u548c\u503c\uff0c\u4ee5\u4fbf\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u4f7f\u7528\u3002get typeOptions()<\/code><\/p>\n\n\n\n
\u8be5\u63a5\u53e3\u63d0\u4f9b\u6709\u5173\u6d41\u4e2d\u5143\u7d20\u548c\u8d44\u6e90\u7684\u6570\u636e\u3002builderContext<\/code><\/p>\n\n\n\n
\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6d41\u4e2d\u7684\u5143\u7d20\u548c\u8d44\u6e90\u3002builderContext<\/code><\/p>\n\n\n\n
\u8be5\u65b9\u6cd5\u4f7f\u7528\u53d8\u91cf\u4e2d\u7684\u6570\u636e\u4f5c\u4e3a\u53ef\u8c03\u7528\u64cd\u4f5c\u8f93\u5165\u53c2\u6570\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e0a\u7684\u8f93\u5165\u503c\u9009\u9879\u3002get valueOptions()<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u4e3a\u8bb0\u5f55\u53d8\u91cf\u7684\u5bf9\u8c61<\/strong>\u8f93\u5165\u503c\u65f6\uff0c\u8be5\u65b9\u6cd5\u4f1a\u5c06\u4e8b\u4ef6\u8c03\u5ea6\u5230 Flow Builder\u3002Flow Builder \u63a5\u6536\u4e8b\u4ef6\u5e76\u66f4\u65b0\u6d41\u4e2d\u7684\u503c\u3002handleInputTypeChange<\/code>configuration_editor_generic_type_mapping_changed<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8f93\u5165\u7528\u4e8e\u5b58\u50a8\u8f93\u51fa\u7684\u5bf9\u8c61<\/strong>\u7684\u503c\u65f6\uff0c\u8be5\u65b9\u6cd5\u4f1a\u5c06\u4e8b\u4ef6\u8c03\u5ea6\u5230 Flow Builder\u3002Flow Builder \u63a5\u6536\u4e8b\u4ef6\u5e76\u66f4\u65b0\u6d41\u4e2d\u7684\u503c\u3002handleOutputTypeChange<\/code>configuration_editor_generic_type_mapping_changed<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8f93\u5165\u201c\u8bb0\u5f55\u53d8\u91cf<\/strong>\u201d\u7684\u503c\u65f6\uff0c\u8be5\u65b9\u6cd5\u4f1a\u5c06\u4e8b\u4ef6\u8c03\u5ea6\u5230 Flow Builder\u3002Flow Builder \u63a5\u6536\u4e8b\u4ef6\u5e76\u66f4\u65b0\u6d41\u4e2d\u7684\u503c\u3002handleValueChange<\/code>configuration_editor_input_value_changed<\/code><\/p>\n\n\n\n
\u4e0b\u9762\u662f \u7684\u914d\u7f6e\u6587\u4ef6\u3002selectRecordEditor<\/code><\/p>\n\n\n\n
<!--selectRecordEditor.js-meta.xml-->\n<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<LightningComponentBundle xmlns=\"http:\/\/soap.sforce.com\/2006\/04\/metadata\">\n    <apiVersion>50.0<\/apiVersion>\n    <!--isExposed can be true or false-->\n    <isExposed>true<\/isExposed>\n<\/LightningComponentBundle><\/code><\/pre>\n\n\n\n
\u793a\u4f8b\uff1a\u5c4f\u5e55\u7ec4\u4ef6\u7684\u901a\u7528 SObject \u8f93\u5165<\/h2>\n\n\n\n
\u6b64\u793a\u4f8b\u4e3a\u4f7f\u7528\u6cdb\u578b\u8f93\u5165\u503c\u7684\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\u521b\u5efa\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002\u7ba1\u7406\u5458\u4f7f\u7528\u9009\u62e9\u5217\u8868\u5b57\u6bb5\u4e3a\u8bb0\u5f55\u53d8\u91cf\u7684\u5bf9\u8c61\u548c\u8bb0\u5f55\u53d8\u91cf\u8bbe\u7f6e\u5c4f\u5e55\u7ec4\u4ef6\u7684\u8f93\u5165\u503c\u3002\u5f53\u7528\u6237\u8fd0\u884c\u6b64\u793a\u4f8b\u7684\u6d41\u65f6\uff0c\u5c4f\u5e55\u7ec4\u4ef6\u5c06\u663e\u793a\u8bb0\u5f55\u96c6\u5408\u4e2d\u7684\u7b2c\u4e00\u6761\u8bb0\u5f55\u3002sObject<\/code><\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u4ee5\u4e0b HTML\u3001JavaScript \u548c\u914d\u7f6e\u6587\u4ef6\u5b9a\u4e49\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\u3002displayRecord<\/code><\/p>\n\n\n\n
<!--displayRecord.html-->\n<template>\n  <p>Record Name: {inputValue.Name}<\/p>\n<\/template><\/code><\/pre>\n\n\n\n
JavaScript \u7c7b\u5b9a\u4e49\u4e00\u4e2a\u516c\u5171\u5c5e\u6027\u3002inputValue<\/code><\/p>\n\n\n\n
\/\/ displayRecord.js\nimport { LightningElement, api } from \"lwc\";\n\nexport default class DisplayRecord extends LightningElement {\n  @api\n  inputValue;\n}<\/code><\/pre>\n\n\n\n
\u8981\u5728 Flow Builder \u4e2d\u516c\u5f00\u516c\u5171\u5c5e\u6027\uff0c\u8bf7\u5728\u914d\u7f6e\u6587\u4ef6\u4e2d\u5b9a\u4e49\u5b83\u3002\u82e5\u8981\u5c06\u5c5e\u6027\u5b9a\u4e49\u4e3a\u6cdb\u578b\u6570\u636e\u7c7b\u578b\uff0c\u8bf7\u5b9a\u4e49\u5b50\u6807\u8bb0\u3002\u5b50\u6807\u8bb0\u6269\u5c55\u6cdb\u578b\u6570\u636e\u7c7b\u578b\u3002\u7684\u5c5e\u6027\u5f15\u7528\u5b50\u6807\u8bb0\u7684\u5c5e\u6027\u3002\u4f8b\u5982\uff0c\u5982\u679c \uff0c\u5219 .\u5b50\u6807\u8bb0\u7684\u5c5e\u6027\u5fc5\u987b\u4f4d\u4e8e\u5927\u62ec\u53f7\u5185\u3002\u8981\u5c06\u5c5e\u6027\u5b9a\u4e49\u4e3a\u6cdb\u578b\u96c6\u5408\u6570\u636e\u7c7b\u578b\uff0c\u8bf7\u8ffd\u52a0 \uff0c\u4f8b\u5982 \u3002inputValue<\/code>sObject<\/code>propertyType<\/code>sObject<\/code>type<\/code>inputValue<\/code>name<\/code>propertyType<\/code>propertyType name=\"T\"<\/code>property type=\"{T}\"<\/code>type<\/code>property<\/code>sObject<\/code>[]<\/code>property type=\"{T[]}\"<\/code><\/p>\n\n\n\n
\u8be5\u7279\u6027\u786e\u5b9a\u5c5e\u6027\u662f\u5426\u53ef\u4ee5\u63a5\u6536\u6765\u81ea\u6d41\u7684\u8f93\u5165\u3002\u7f3a\u7701\u503c\u4e3a \u3002\u82e5\u8981\u4f7f\u5c5e\u6027\u4ec5\u53ef\u7528\u4e8e\u8f93\u5165\u6216\u8f93\u51fa\uff0c\u8bf7\u5c06\u8be5\u7279\u6027\u8bbe\u7f6e\u4e3a \u6216 \u3002role<\/code>inputAndOutput<\/code>role<\/code>inputOnly<\/code>outputOnly<\/code><\/p>\n\n\n\n
\u5728\u914d\u7f6e\u6587\u4ef6\u4e2d\uff0c\u4f7f\u7528\u8be5\u7279\u6027\u6ce8\u518c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002configurationEditor<\/code><\/p>\n\n\n\n
\u9664\u975e\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u5426\u5219\u8bf7\u4f7f\u7528\u547d\u540d\u7a7a\u95f4\u3002\u5982\u679c\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u8bf7\u4f7f\u7528\u8be5\u547d\u540d\u7a7a\u95f4\u3002c<\/code><\/p>\n\n\n\n
<!-- displayRecord.js-meta.xml-->\n<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<LightningComponentBundle xmlns=\"http:\/\/soap.sforce.com\/2006\/04\/metadata\">\n  <apiVersion>50.0<\/apiVersion>\n  <isExposed>true<\/isExposed>\n  <targets>\n    <target>lightning__FlowScreen<\/target>\n  <\/targets>\n  <masterLabel>Display Record<\/masterLabel>\n  <targetConfigs>\n    <targetConfig targets=\"lightning__FlowScreen\" configurationEditor=\"c-display-record-editor\">\n      <propertyType name=\"T\" extends=\"SObject\" label=\"Input Type\" description=\"Generic sObject data type used for input sObject properties\" \/>\n      <property name=\"inputValue\" type={T} label=\"input value\" role=\"inputOnly\" \/>\n    <\/targetConfig>\n  <\/targetConfigs>\n<\/LightningComponentBundle><\/code><\/pre>\n\n\n\n
\u4ee5\u4e0b HTML\u3001JavaScript \u548c\u914d\u7f6e\u6587\u4ef6\u5b9a\u4e49\u7ec4\u4ef6\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002displayRecord<\/code><\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684 HTML \u6a21\u677f\u5b9a\u4e49\u4e86 UI\uff0c\u8be5 UI \u4f7f\u7528\u7ec4\u5408\u6846\u57fa\u7840 Lightning Web \u7ec4\u4ef6\u3002<\/p>\n\n\n\n
<!--displayRecordEditor.html-->\n<template>\n  <lightning-combobox\n    name=\"inputType\"\n    label=\"Object for Record Variable\"\n    value=\"{inputType}\"\n    placeholder=\"Select object...\"\n    options=\"{typeOptions}\"\n    onchange=\"{handleInputTypeChange}\"\n  >\n  <\/lightning-combobox>\n\n  <lightning-combobox\n    name=\"inputValue\"\n    label=\"Record Variable\"\n    value=\"{inputValue}\"\n    placeholder=\"Select record variable...\"\n    options=\"{valueOptions}\"\n    onchange=\"{handleValueChange}\"\n  >\n  <\/lightning-combobox>\n<\/template><\/code><\/pre>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u65f6\uff0c\u5176 JavaScript \u7c7b\u4f1a\u4ece Flow Builder \u63a5\u6536\u6d41\u5143\u6570\u636e\u7684\u526f\u672c\u3002\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8fdb\u884c\u66f4\u65b0\u65f6\uff0c\u5b83\u4f1a\u8c03\u5ea6\u4e00\u4e2a\u4e8b\u4ef6\u4ee5\u5c06\u66f4\u6539\u4f20\u64ad\u56de Flow Builder\u3002<\/p>\n\n\n\n
\u6ce8\u610f<\/p>\n\n\n\n
\u4f7f\u7528\u5c5e\u6027\u4ece\u6d41\u4e2d\u6355\u83b7\u6570\u636e\u3002\u4f7f\u7528\u4e8b\u4ef6\u5728\u8fd0\u884c\u65f6\u62a5\u544a\u5bf9\u6d41\u7684\u66f4\u6539\u3002@api<\/code><\/p>\n\n\n\n
\/\/ displayRecordEditor.js\nimport { LightningElement, api } from 'lwc';\n\nexport default class DisplayRecordEditor extends LightningElement {\n  @api\n  inputVariables;\n\n  @api\n  genericTypeMappings;\n\n  @api\n  builderContext;\n\n  get inputValue() {\n    const param = this.inputVariables.find(({ name }) => name === 'inputValue');\n    return param && param.value;\n  }\n\n  get inputType() {\n    const type = this.genericTypeMappings.find(\n      ({ typeName }) => typeName === 'T'\n    );\n    return type && type.typeValue;\n  }\n\n  get typeOptions() {\n    return [\n      { label: 'Account', value: 'Account' },\n      { label: 'Case', value: 'Case' },\n      { label: 'Lead', value: 'Lead' },\n    ];\n  }\n\n  get valueOptions() {\n    const variables = this.builderContext.variables;\n    return variables.map(({ name }) => ({\n      label: name,\n      value: name,\n    }));\n  }\n\n  handleInputTypeChange(event) {\n    if (event && event.detail) {\n    const newValue = event.detail.value;\n    const typeChangedEvent = new CustomEvent(\n      'configuration_editor_generic_type_mapping_changed',\n      {\n        bubbles: true,\n        cancelable: false,\n        composed: true,\n        detail: {\n          typeName: 'T',\n          typeValue: newValue\n        },\n      }\n    );\n    this.dispatchEvent(typeChangedEvent);\n    }\n  }\n\n  handleValueChange(event) {\n    if (event && event.detail) {\n      const newValue = event.detail.value;\n      const valueChangedEvent = new CustomEvent(\n        'configuration_editor_input_value_changed',\n        {\n          bubbles: true,\n          cancelable: false,\n          composed: true,\n          detail: {\n            name: 'inputValue',\n            newValue,\n            newValueDataType: 'reference',\n          },\n        }\n      );\n    this.dispatchEvent(valueChangedEvent);\n    }\n  }\n}<\/code><\/pre>\n\n\n\n
Flow Builder \u5177\u6709\u7528\u4e8e\u4e0e\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u8fdb\u884c\u901a\u4fe1\u7684\u00a0JavaScript \u63a5\u53e3\u3002\u6b64 JavaScript \u7c7b\u4f7f\u7528 \u3001 \u548c \u63a5\u53e3\u3002inputVariablesbuilderContextgenericTypeMappings<\/code><\/p>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u540e\uff0c\u4ece Flow Builder \u63a5\u6536\u5c4f\u5e55\u7ec4\u4ef6\u4e2d\u516c\u5171\u5c5e\u6027\u7684\u503c\u3002inputVariables<\/code><\/p>\n\n\n\n
\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6bcf\u4e2a\u8f93\u5165\u53d8\u91cf\u7684\u540d\u79f0\u3001\u503c\u548c\u6570\u636e\u7c7b\u578b\u3002inputVariables<\/code><\/p>\n\n\n\n
[\n  {\n    name: \"inputType\",\n    value: \"Account\",\n    valueDataType: \"Account\",\n  },\n];<\/code><\/pre>\n\n\n\n
\u83b7\u53d6\u8981\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u4f7f\u7528\u7684\u5c5e\u6027\u7684\u503c\u3002get inputValue()<\/code>inputValue<\/code><\/p>\n\n\n\n
\u8be5\u63a5\u53e3\u4ece Flow Builder \u63a5\u6536\u8f93\u5165\u53d8\u91cf\u7684\u503c\uff0c\u8fd9\u4e9b\u53d8\u91cf\u662f\u5c4f\u5e55\u7ec4\u4ef6\u4e2d\u7684\u6cdb\u578b\u6570\u636e\u7c7b\u578b\u3002genericTypeMappings<\/code>sObject<\/code><\/p>\n\n\n\n
\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6bcf\u4e2a\u8f93\u5165\u7684\u540d\u79f0\u548c\u503c\u3002\u662f\u6cdb\u578b\u8f93\u5165\u7684\u540d\u79f0;\u4f8b\u5982\u3002\u662f\u6cdb\u578b\u8f93\u5165\u7684\u7279\u5b9a\u503c;\u4f8b\u5982\u3002typeName<\/code>sObject<\/code>'T'<\/code>typeValue<\/code>sObject<\/code>Account<\/code><\/p>\n\n\n\n
[\n  {\n    typeName: \"T\",\n    typeValue: \"Account\",\n  },\n];<\/code><\/pre>\n\n\n\n
\u83b7\u53d6\u8981\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u4f7f\u7528\u7684\u5c5e\u6027\u7684\u6570\u636e\u7c7b\u578b\u3002get inputType()<\/code>inputValue<\/code><\/p>\n\n\n\n
\u8be5\u65b9\u6cd5\u83b7\u53d6\u6bcf\u4e2a\u5bf9\u8c61\u8f93\u5165\u9009\u9879\u7684\u6807\u7b7e\u548c\u503c\uff0c\u4ee5\u4fbf\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u4f7f\u7528\u3002get typeOptions()<\/code><\/p>\n\n\n\n
\u8be5\u63a5\u53e3\u63d0\u4f9b\u6709\u5173\u6d41\u4e2d\u5143\u7d20\u548c\u8d44\u6e90\u7684\u6570\u636e\u3002builderContext<\/code><\/p>\n\n\n\n
{\n  actionCalls: [],\n  apexPluginCalls: [],\n  constants: [],\n  formulas: [],\n  recordCreates: [],\n  recordDeletes: [],\n  recordLookups: [],\n  recordUpdates: [],\n  screens: [],\n  stages: [],\n  textTemplates: [],\n  variables: []\n}<\/code><\/pre>\n\n\n\n
\u8be5\u65b9\u6cd5\u4f7f\u7528\u6765\u81ea \u7684\u6570\u636e\u4f5c\u4e3a\u5c4f\u5e55\u7ec4\u4ef6\u8f93\u5165\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e0a\u7684\u8f93\u5165\u503c\u9009\u9879\u3002get valueOptions()<\/code>variables<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u4e3a\u8bb0\u5f55\u53d8\u91cf\u7684\u5bf9\u8c61<\/strong>\u8f93\u5165\u503c\u65f6\uff0c\u8be5\u65b9\u6cd5\u4f1a\u5c06\u4e8b\u4ef6\u8c03\u5ea6\u5230 Flow Builder\u3002Flow Builder \u63a5\u6536\u4e8b\u4ef6\u5e76\u66f4\u65b0\u6d41\u4e2d\u7684\u503c\u3002handleInputTypeChange<\/code>configuration_editor_generic_type_mapping_changed<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8f93\u5165\u201c\u8bb0\u5f55\u53d8\u91cf<\/strong>\u201d\u7684\u503c\u65f6\uff0c\u8be5\u65b9\u6cd5\u4f1a\u5c06\u4e8b\u4ef6\u8c03\u5ea6\u5230 Flow Builder\u3002Flow Builder \u63a5\u6536\u4e8b\u4ef6\u5e76\u66f4\u65b0\u6d41\u4e2d\u7684\u503c\u3002handleValueChange<\/code>configuration_editor_input_value_changed<\/code><\/p>\n\n\n\n
\u8fd9\u662f \u7684\u914d\u7f6e\u6587\u4ef6\u3002displayRecordEditor<\/code><\/p>\n\n\n\n
<!--displayRecordEditor.js-meta.xml-->\n<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<LightningComponentBundle xmlns=\"http:\/\/soap.sforce.com\/2006\/04\/metadata\">\n  <apiVersion>50.0<\/apiVersion>\n  <!--isExposed can be true or false-->\n  <isExposed>true<\/isExposed>\n<\/LightningComponentBundle><\/code><\/pre>\n\n\n\n
\u793a\u4f8b\uff1a\u53ef\u8c03\u7528\u64cd\u4f5c\u7684 SObject \u8f93\u5165<\/h2>\n\n\n\n
\u6b64\u793a\u4f8b\u521b\u5efa\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7ec4\u4ef6\uff0c\u8be5\u7ec4\u4ef6\u4ee5\u4f7f\u7528 Contact \u5bf9\u8c61\u8f93\u5165\u53c2\u6570\u7684\u53ef\u8c03\u7528\u64cd\u4f5c\u547d\u540d\u3002\u53ef\u8c03\u7528\u64cd\u4f5c\u662f\u53ef\u4ee5\u6dfb\u52a0\u5230\u6d41\u7a0b\u4e2d\u7684 Apex \u65b9\u6cd5\u3002\u5728 Flow Builder \u4e2d\uff0c\u7ba1\u7406\u5458\u4f7f\u7528\u6587\u672c\u5b57\u6bb5\u6765\u8bbe\u7f6e\u53ef\u8c03\u7528\u64cd\u4f5c\u7684\u8054\u7cfb\u4eba\u8f93\u5165\u53c2\u6570\u3002\u5f53\u7528\u6237\u8fd0\u884c\u6b64\u793a\u4f8b\u7684\u6d41\u65f6\uff0c\u53ef\u8c03\u7528\u64cd\u4f5c\u4f1a\u5b58\u50a8\u4e00\u4e2a\u65b0\u8054\u7cfb\u4eba\u3002createContactActionEditor<\/code><\/p>\n\n\n\n
\u6b64 Apex \u7c7b\u6587\u4ef6\u5b9a\u4e49\u4e86\u53ef\u4f5c\u4e3a\u53ef\u8c03\u7528\u64cd\u4f5c\u8fd0\u884c\u7684\u65b9\u6cd5\u53ca\u5176\u8f93\u5165\u53d8\u91cf\u3002\u6ce8\u91ca\u6807\u8bc6\u53ef\u4ee5\u4f5c\u4e3a\u53ef\u8c03\u7528\u64cd\u4f5c\u8fd0\u884c\u7684\u65b9\u6cd5\u3002\u6ce8\u91ca\u6807\u8bc6\u53ef\u8c03\u7528\u65b9\u6cd5\u4f7f\u7528\u7684\u53d8\u91cf\u3002createContact<\/code>@InvocableMethod<\/code>@InvocableVariable<\/code><\/p>\n\n\n\n
\u53ef\u8c03\u7528\u65b9\u6cd5\u5728\u4fee\u9970\u7b26\u4e2d\u6ce8\u518c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7ec4\u4ef6\u3002\u9664\u975e\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u5426\u5219\u7ec4\u4ef6\u547d\u540d\u7a7a\u95f4\u3002\u5982\u679c\u7ec4\u7ec7\u5177\u6709\u81ea\u5b9a\u4e49\u547d\u540d\u7a7a\u95f4\uff0c\u8bf7\u4f7f\u7528\u8be5\u547d\u540d\u7a7a\u95f4\u6ce8\u518c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7ec4\u4ef6\u3002\u5728\u6b64\u793a\u4f8b\u4e2d\uff0c\u7ec4\u4ef6\u7684\u540d\u79f0\u4e3a \u3002configurationEditor<\/code>c<\/code>c-create-contact-action-editor<\/code><\/p>\n\n\n\n
\/\/CreateContactAction.cls\nglobal class CreateContactAction {\n    global class CreateContactRequest {\n\n        @InvocableVariable\n        global Contact contact;\n    }\n\n    global class CreateContactResult {\n        @InvocableVariable\n        global Boolean isSuccess;\n\n        @InvocableVariable\n        global String errorMessage;\n\n        @InvocableVariable\n        global String contactId;\n   }\n\n    @InvocableMethod(label='Create Contact' configurationEditor='c-create-contact-action-editor')\n    global static List<CreateContactResult> createContact(List<CreateContactRequest> requests) {\n        List<CreateContactResult> results = new List<CreateContactResult>();\n            for(CreateContactRequest request : requests){\n        results.add(insertContact(request));\n        }\n        return results;\n    }\n\n    public static CreateContactResult insertContact(CreateContactRequest request) {\n        List<Contact> contactList = new List<Contact>();\n        contactList.add(request.contact);\n\n        Database.SaveResult[] srList = Database.insert(contactList, true);\n\n        CreateContactResult contactResult = new CreateContactResult();\n            for(Database.SaveResult sr: srList) {\n                if (sr.isSuccess()) {\n                    contactResult.isSuccess = sr.isSuccess();\n                    contactResult.contactId = sr.getId();\n                }\n                else {\n                    for(Database.Error err : sr.getErrors()) {\n                        contactResult.errorMessage = err.getStatusCode() + ': ' + err.getMessage();\n                    }\n                }\n            }\n\n    return contactResult;\n    }\n}<\/code><\/pre>\n\n\n\n
\u4e0b\u9762\u662f \u7684\u914d\u7f6e\u6587\u4ef6\u3002CreateContactAction<\/code><\/p>\n\n\n\n
<!--CreateContactAction.cls-meta.xml-->\n\n<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<ApexClass xmlns=\"urn:metadata.tooling.soap.sforce.com\" fqn=\"CreateContactAction\">\n    <apiVersion>53.0<\/apiVersion>\n    <status>Active<\/status>\n<\/ApexClass><\/code><\/pre>\n\n\n\n
\u8fd9\u4e9b HTML\u3001CSS\u3001JavaScript \u548c\u914d\u7f6e\u6587\u4ef6\u5b9a\u4e49\u64cd\u4f5c\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7ec4\u4ef6\u3002createContactActionEditor<\/code><\/p>\n\n\n\n
\u7ec4\u4ef6\u7684 HTML \u6a21\u677f\u5b9a\u4e49\u4e86 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684 UI\u3002<\/p>\n\n\n\n
<!--createContactActionEditor.html-->\n\n<template>\n  <div class=\"slds-m-top_small\">\n    <h2 class=\"slds-text-heading_medium slds-p-around_xx-small lgc-bg-inverse\">\n      Contact Primary Information\n    <\/h2>\n\n    <lightning-input\n      label=\"First Name\"\n      value={defaultContact.FirstName}\n      onchange={handleFirstNameChange}\n    >\n    <\/lightning-input>\n\n    <lightning-input\n      label=\"Last Name\"\n      value={defaultContact.LastName}\n      onchange={handleLastNameChange}\n    >\n    <\/lightning-input>\n  <\/div>\n\n  <div class=\"slds-m-top_small\">\n    <h2 class=\"slds-text-heading_medium slds-p-around_xx-small lgc-bg-inverse\">Contact Source<\/h2>\n\n    <lightning-input\n      label=\"European Country Code\"\n      value={defaultContact.European_Country_Code__c}\n      onchange={handleCountryCodeChange}\n    >\n    <\/lightning-input>\n  <\/div>\n<\/template><\/code><\/pre>\n\n\n\n
\u6b64\u793a\u4f8b\u663e\u793a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668 UI\u3002<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7ec4\u4ef6\u65f6\uff0c\u5176 JavaScript \u7c7b\u4f1a\u4ece Flow Builder \u63a5\u6536\u6d41\u5143\u6570\u636e\u7684\u526f\u672c\u3002\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u66f4\u6539\u503c\u65f6\uff0c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7ec4\u4ef6\u4f1a\u8c03\u5ea6\u4e00\u4e2a\u4e8b\u4ef6\u4ee5\u5c06\u66f4\u6539\u4f20\u64ad\u56de Flow Builder\u3002<\/p>\n\n\n\n
\u6ce8\u610f<\/p>\n\n\n\n
\u4f7f\u7528\u5c5e\u6027\u4ece\u6d41\u4e2d\u6355\u83b7\u6570\u636e\u3002\u4f7f\u7528\u4e8b\u4ef6\u5728\u8fd0\u884c\u65f6\u62a5\u544a\u5bf9\u6d41\u7684\u66f4\u6539\u3002@api<\/code><\/p>\n\n\n\n
\/\/createContactActionEditor.js\n\nimport { LightningElement, api } from \"lwc\";\n\nexport default class CreateContactActionEditor extends LightningElement {\n  @api\n  inputVariables;\n\n  defaultContact = {\n    attributes: {\n      type: \"Contact\",\n    },\n    European_Country_Code__c: \"FRA\",\n  };\n\n  get contact() {\n    const param = this.inputVariables.find(({ name }) => name === \"contact\");\n    return param && param.value;\n  }\n\n  handleFirstNameChange(event) {\n    this.defaultContact[\"FirstName\"] = event.detail.value;\n    this.handleContact();\n  }\n\n  handleLastNameChange(event) {\n    this.defaultContact[\"LastName\"] = event.detail.value;\n    this.handleContact();\n  }\n\n  handleCountryCodeChange(event) {\n    this.defaultContact[\"European_Country_Code__c\"] = event.detail.value;\n    this.handleContact();\n  }\n\n  handleContact() {\n    const newValue = JSON.stringify(this.defaultContact);\n    const valueChangedEvent = new CustomEvent(\"configuration_editor_input_value_changed\", {\n      bubbles: true,\n      cancelable: false,\n      composed: true,\n      detail: {\n        name: \"contact\",\n        newValue,\n        newValueDataType: \"SObject\",\n      },\n    });\n    this.dispatchEvent(valueChangedEvent);\n  }\n}<\/code><\/pre>\n\n\n\n
Flow Builder \u5177\u6709\u7528\u4e8e\u4e0e\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u8fdb\u884c\u901a\u4fe1\u7684\u00a0JavaScript \u63a5\u53e3\u3002\u6b64 JavaScript \u7c7b\u4f7f\u7528\u8be5\u63a5\u53e3\u3002inputVariables<\/code><\/p>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u540e\uff0c\u4ece Flow Builder \u63a5\u6536\u53ef\u8c03\u7528\u64cd\u4f5c\u4e2d\u8f93\u5165\u53d8\u91cf\u7684\u503c\u3002\u7f3a\u7701\u503c\u4e3a type \u548c \u8bbe\u7f6e\u3002\u5f53\u60a8\u5bf9 sObject \u6570\u636e\u7c7b\u578b\u7684\u8f93\u5165\u4f7f\u7528\u6587\u672c\u503c\u65f6\uff0c\u8bf7\u6307\u5b9a\u8be5\u503c\uff0c\u4f8b\u5982 \u3002inputVariables<\/code>European_Country_Code__c<\/code>type<\/code>Contact<\/code><\/p>\n\n\n\n
\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6bcf\u4e2a\u8f93\u5165\u53d8\u91cf\u7684\u540d\u79f0\u3001\u503c\u548c\u6570\u636e\u7c7b\u578b\u3002inputVariables<\/code><\/p>\n\n\n\n
[{\n    name: 'contact',\n    value: '{\n        \"attributes\": {\n            \"type\": \"Contact\"\n        },\n        \"FirstName\" : \"\",\n        \"LastName\": \"\",\n        \"European_Country_Code__c\" : \"FRA\"\n    }',\n    valueDataType: 'SObject'\n}]<\/code><\/pre>\n\n\n\n
\u8be5\u65b9\u6cd5\u83b7\u53d6\u8f93\u5165\u53d8\u91cf\u7684\u503c\uff0c\u4ee5\u4fbf\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u4f7f\u7528\u3002get contact()<\/code><\/p>\n\n\n\n
\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8f93\u5165\u8f93\u5165\u503c\u65f6\uff0c\u8be5\u65b9\u6cd5\u4f1a\u5c06\u4e8b\u4ef6\u8c03\u5ea6\u5230 Flow Builder\u3002Flow Builder \u63a5\u6536\u4e8b\u4ef6\u5e76\u66f4\u65b0\u6d41\u4e2d\u7684\u503c\u3002handleContact<\/code>configuration_editor_input_value_changed<\/code><\/p>\n\n\n\n
\u4e0b\u9762\u662f \u7684\u914d\u7f6e\u6587\u4ef6\u3002createContactActionEditor<\/code><\/p>\n\n\n\n
<!---createContactActionEditor.js-meta.xml-->\n<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<LightningComponentBundle xmlns=\"http:\/\/soap.sforce.com\/2006\/04\/metadata\">\n    <apiVersion>53.0<\/apiVersion>\n    <!--isExposed can be true or false-->\n    <isExposed>true<\/isExposed>\n<\/LightningComponentBundle><\/code><\/pre>\n\n\n\n
\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668 JavaScript \u63a5\u53e3<\/h2>\n\n\n\n
\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4f7f\u7528\u8fd9\u4e9b JavaScript \u51fd\u6570\u4e0e Flow Builder \u8fdb\u884c\u901a\u4fe1\u3002<\/p>\n\n\n\n
\u8f93\u5165\u53d8\u91cf<\/h2>\n\n\n\n
\u8be5\u63a5\u53e3\u63d0\u4f9b\u6709\u5173 FlowScreenField \u5143\u6570\u636e\u7684\u6570\u636e\u3002inputVariables<\/code><\/p>\n\n\n\n
_inputVariables = [];\n\n@api\nget inputVariables() {\n    return this._inputVariables;\n}\n\n\/\/ Set a field with the data that was stored from the flow.\nset inputVariables(variables) {\n    this._inputVariables = variables || [];\n}<\/code><\/pre>\n\n\n\n
\u4e2d\u7684\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6bcf\u4e2a\u8f93\u5165\u53d8\u91cf\u7684\u540d\u79f0\u3001\u503c\u548c\u6570\u636e\u7c7b\u578b\u3002_inputVariables<\/code><\/p>\n\n\n\n
[{\n    name: 'volume',\n    value: '10',\n    valueDataType: 'Number'\n}]<\/code><\/pre>\n\n\n\n
\u6709\u5173\u6d41\u5143\u6570\u636e\u7684\u66f4\u591a\u4fe1\u606f\uff0c\u8bf7\u53c2\u9605\u6d41\u5143\u6570\u636e API\u3002<\/p>\n\n\n\n
builder\u4e0a\u4e0b\u6587<\/h2>\n\n\n\n
\u8be5\u63a5\u53e3\u63d0\u4f9b\u6709\u5173\u6d41\u4e2d\u5143\u7d20\u548c\u8d44\u6e90\u7684\u6570\u636e\u3002\u4f8b\u5982\uff0c\u548c\u6570\u636e\u7ed3\u6784\u5305\u62ec\u8f93\u5165\u53d8\u91cf\u7684\u540d\u79f0\u548c\u7c7b\u578b\u3002\u5728 Flow Builder \u4e2d\uff0c\u7ba1\u7406\u5458\u53ef\u4ee5\u5c06\u6709\u5173\u5176\u4ed6\u5143\u7d20\u548c\u8d44\u6e90\u7684\u6570\u636e\u7528\u4f5c\u5c4f\u5e55\u7ec4\u4ef6\u8f93\u5165\u5c5e\u6027\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684\u8f93\u5165\u3002builderContext<\/code>screens<\/code>actionCalls<\/code><\/p>\n\n\n\n
\u4ece\u754c\u9762\u4f20\u9012\u5230\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6d41\u4e2d\u7684\u5143\u7d20\u548c\u8d44\u6e90\u3002builderContext<\/code><\/p>\n\n\n\n
{\n    actionCalls: [],\n    apexPluginCalls: [],\n    constants: [],\n    formulas: [],\n    recordCreates: [],\n    recordDeletes: [],\n    recordLookups: [],\n    recordUpdates: [],\n    screens: [],\n    stages: [],\n    textTemplates: [],\n    variables: []\n}<\/code><\/pre>\n\n\n\n
\u6709\u5173\u6d41\u5143\u6570\u636e\u7684\u66f4\u591a\u4fe1\u606f\uff0c\u8bf7\u53c2\u9605\u6d41\u5143\u6570\u636e API\u3002<\/p>\n\n\n\n
\u5728\u4ee5\u4e0b\u793a\u4f8b\u4e2d\uff0c\u5f00\u53d1\u4eba\u5458\u521b\u5efa\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\u53ca\u5176\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002\u5728 Flow Builder \u4e2d\uff0c\u7ba1\u7406\u5458\u4f7f\u7528\u7ec4\u5408\u6846\u8bbe\u7f6e\u7535\u5b50\u90ae\u4ef6\u7684\u53d1\u4ef6\u4eba\u59d3\u540d\u3002\u5f53\u7528\u6237\u8fd0\u884c\u6d41\u7a0b\u65f6\uff0c\u6d41\u7a0b\u5c4f\u5e55\u4f1a\u663e\u793a\u7535\u5b50\u90ae\u4ef6\u7684\u9009\u5b9a\u540d\u79f0\u3002<\/p>\n\n\n\n
\u4ee5\u4e0b HTML\u3001JavaScript \u548c\u914d\u7f6e\u6587\u4ef6\u5b9a\u4e49\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\u3002<\/p>\n\n\n\n
<!--htmlEmail.html-->\n<template>\n  <p>Selected sender's name is: {senderName}<\/p>\n<\/template><\/code><\/pre>\n\n\n\n
\u6b64 JavaScript \u6587\u4ef6\u5b9a\u4e49\u4e86\u4e00\u4e2a\u516c\u5171\u5c5e\u6027\u3002senderName<\/code><\/p>\n\n\n\n
\/\/ htmlEmail.js\n\nimport { LightningElement, api } from \"lwc\";\n\nexport default class HTMLEmail extends LightningElement {\n  @api senderName;\n}<\/code><\/pre>\n\n\n\n
\u6b64\u914d\u7f6e\u6587\u4ef6\u6ce8\u518c\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002<\/p>\n\n\n\n
<LightningComponentBundle xmlns=\"http:\/\/soap.sforce.com\/2006\/04\/metadata\">\n    <apiVersion>49.0<\/apiVersion>\n    <isExposed>true<\/isExposed>\n    <targets>\n        <target>lightning__FlowScreen<\/target>\n    <\/targets>\n    <masterLabel>HTMLEmail<\/masterLabel>\n    <targetConfigs>\n        <targetConfig targets=\"lightning__FlowScreen\" configurationEditor=\"c-html-email-editor\">\n            <property name=\"senderName\" type=\"String\" role=\"inputOnly\" \/>\n        <\/targetConfig>\n    <\/targetConfigs>\n<\/LightningComponentBundle><\/code><\/pre>\n\n\n\n
\u4ee5\u4e0b HTML\u3001JavaScript \u548c\u914d\u7f6e\u6587\u4ef6\u5b9a\u4e49\u5c4f\u5e55\u7ec4\u4ef6\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u3002<\/p>\n\n\n\n
\u6b64 HTML \u6587\u4ef6\u5b9a\u4e49 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684 UI\u3002UI \u663e\u793a\u4e00\u4e2a\u7ec4\u5408\u6846\u57fa\u7840 Lightning Web \u7ec4\u4ef6\u3002<\/p>\n\n\n\n
<!--htmlEmailEditor.html-->\n<template>\n  <div class=\"slds-p-around_xx-small\">\n    <lightning-combobox\n      name=\"senderName\"\n      label=\"Sender Display Name\"\n      value={senderName}\n      placeholder=\"Select Sender\"\n      options={options}\n      onchange={handleChange}\n    >\n    <\/lightning-combobox>\n\n    <p class=\"slds-p-top_xx-small\">Selected sender's name is: {senderName}<\/p>\n  <\/div>\n<\/template><\/code><\/pre>\n\n\n\n
\u521d\u59cb\u5316\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u65f6\uff0cJavaScript \u7c7b\u4f1a\u4ece Flow Builder \u63a5\u6536\u6d41\u5143\u6570\u636e\u7684\u526f\u672c\u3002\u5982\u679c\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8fdb\u884c\u66f4\u65b0\uff0c\u5219\u4f1a\u8c03\u5ea6\u4e00\u4e2a\u4e8b\u4ef6\u4ee5\u5c06\u66f4\u6539\u4f20\u64ad\u56de Flow Builder\u3002<\/p>\n\n\n\n
\/\/ htmlEmailEditor.js\nimport { LightningElement, api } from \"lwc\";\nexport default class HtmlEmailEditor extends LightningElement {\n  @api\n  inputVariables;\n\n  @api\n  builderContext;\n\n  get senderName() {\n    const param = this.inputVariables.find(({ name }) => name === \"senderName\");\n    return param && param.value;\n  }\n\n  get options() {\n    const variables = this.builderContext.variables;\n    return variables.map(({ name, value }) => ({\n      label: name,\n      value: value.stringValue,\n    }));\n  }\n\n  handleChange(event) {\n    if (event && event.detail) {\n      const newValue = event.detail.value;\n      const valueChangedEvent = new CustomEvent(\"Configuration_editor_input_value_changed\", {\n        bubbles: true,\n        cancelable: false,\n        composed: true,\n        detail: {\n          name: \"senderName\",\n          newValue,\n          newValueDataType: \"String\",\n        },\n      });\n      this.dispatchEvent(valueChangedEvent);\n    }\n  }\n}<\/code><\/pre>\n\n\n\n
\u8be5\u65b9\u6cd5\u8fd4\u56de\u6709\u5173\u4f7f\u7528\u63a5\u53e3\u5b58\u50a8\u7684\u8f93\u5165\u53d8\u91cf\u7684\u4fe1\u606f\u3002\u8be5\u65b9\u6cd5\u8fd4\u56de\u4f7f\u7528\u63a5\u53e3\u65b9\u6cd5\u5b58\u50a8\u7684\u5408\u5e76\u5b57\u6bb5\u5217\u8868\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u5c06\u5408\u5e76\u5b57\u6bb5\u663e\u793a\u4e3a\u5c4f\u5e55\u7ec4\u4ef6\u8f93\u5165\u5c5e\u6027\u7684\u8f93\u5165\u503c\u3002senderName<\/code>senderName<\/code>inputVariables<\/code>options<\/code>builderContext<\/code><\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u5143\u7d20\u4fe1\u606f<\/h2>\n\n\n\n
\u8be5\u63a5\u53e3\u63d0\u4f9b\u6709\u5173\u8c03\u7528\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684\u81ea\u5b9a\u4e49\u6d41\u5c4f\u5e55\u7ec4\u4ef6\u6216\u81ea\u5b9a\u4e49\u64cd\u4f5c\u7684\u6570\u636e\u3002\u4f7f\u7528\u6b64\u63a5\u53e3\u53ef\u4ee5\u6d88\u9664\u5c4f\u5e55\u7ec4\u4ef6\u6216\u64cd\u4f5c\u7684\u4e0d\u540c\u5b9e\u4f8b\u7684\u6b67\u4e49\u3002elementInfo<\/code><\/p>\n\n\n\n
\u6b64\u793a\u4f8b\u5c06\u6d41\u5143\u6570\u636e\u5b58\u50a8\u5728 \u4e2d\uff0c\u4f46\u60a8\u53ef\u4ee5\u968f\u610f\u547d\u540d\u8be5\u5b57\u6bb5\u3002_elementInfo<\/code><\/p>\n\n\n\n
_elementInfo = {};\n@api\nget elementInfo() {\n    return this._elementInfo;\n}\n\n\/\/ Set a local variable with the data that was stored from flow.\nset elementInfo(info) {\n    this._elementInfo = info || {};\n}<\/code><\/pre>\n\n\n\n
\u4e2d\u7684\u6570\u636e\u7ed3\u6784\u5305\u62ec\u6d41\u5143\u6570\u636e\u4e2d\u6d41\u5143\u7d20\u7684 API \u540d\u79f0\u548c\u7c7b\u578b\u3002_elementInfo<\/code><\/p>\n\n\n\n
{\n    apiName: 'slider',\n    type: 'Screen'\n}<\/code><\/pre>\n\n\n\n
type \u7684\u6709\u6548\u503c\u4e3a\uff1a<\/p>\n\n\n\n
    \n
  • Screen<\/code>– \u5c4f\u5e55\u5143\u7d20<\/li>\n\n\n\n
  • Action<\/code>– \u52a8\u4f5c\u5143\u7d20<\/li>\n<\/ul>\n\n\n\n
    \u9a57\u8b49<\/h2>\n\n\n\n
    \u4f7f\u7528\u8be5\u754c\u9762\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u6267\u884c\u81ea\u5b9a\u4e49\u9a8c\u8bc1\u3002\u5f53\u6d41\u7a0b\u7ba1\u7406\u5458\u5728 Flow Builder \u7684\u5c4f\u5e55\u7f16\u8f91\u5668\u4e2d\u5355\u51fb\u201c\u5b8c\u6210<\/strong>\u201d\u65f6\uff0cFlow Builder \u4f1a\u8bc4\u4f30\u6bcf\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u7684\u51fd\u6570\u3002\u5982\u679c\u51fd\u6570\u8fd4\u56de \u548c \u6570\u636e\u7ed3\u6784\uff0c\u5219\u5c4f\u5e55\u7f16\u8f91\u5668\u4f1a\u663e\u793a\u9519\u8bef\u6570\u3002validate<\/code>validate<\/code>key<\/code>errorString<\/code><\/p>\n\n\n\n
    \u6ce8\u610f<\/p>\n\n\n\n
    Flow Builder \u4ec5\u663e\u793a\u9519\u8bef\u6570\u3002\u7f16\u5199\u4ee3\u7801\u4ee5\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u663e\u793a\u9519\u8bef\u5b57\u7b26\u4e32\u3002<\/p>\n\n\n\n
    \u6b64\u793a\u4f8b\u5c06\u6570\u636e\u5b58\u50a8\u5728\u5b57\u6bb5\u4e2d\uff0c\u4f46\u60a8\u53ef\u4ee5\u4f7f\u7528\u4efb\u4f55\u5b57\u6bb5\u540d\u79f0\u3002\u4e3a\u4e86\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u663e\u793a\u9519\u8bef\u5b57\u7b26\u4e32\uff0c\u6211\u4eec\u7528\u4e8e\u67e5\u8be2\u3001\u8bbe\u7f6e\u548c\u62a5\u544a\u9519\u8bef\u5b57\u7b26\u4e32\u3002validity<\/code>sliderCmp<\/code><\/p>\n\n\n\n
    @api\nvalidate() {\n    const sliderCmp = this.template.querySelector('lightning-slider');\n    const validity = [];\n    if (this.volume < 0 || this.volume > 100) {\n        sliderCmp.setCustomValidity('The slider range is between 0 and     100.');\n        validity.push({\n            key: 'Slider Range',\n            errorString: 'The slider range is between 0 and 100.',\n        });\n    } else {\n        sliderCmp.setCustomValidity('');\n    }\n    sliderCmp.reportValidity();\n    return validity;\n}<\/code><\/pre>\n\n\n\n
    genericTypeMappings<\/h2>\n\n\n\n
    \u6570\u636e\u7ed3\u6784\u5305\u62ec\u6bcf\u4e2a\u8f93\u5165\u7684\u540d\u79f0\u548c\u503c\u3002\u662f\u6cdb\u578b\u8f93\u5165\u7684\u540d\u79f0;\u4f8b\u5982\u3002\u662f\u6cdb\u578b\u8f93\u5165\u7684\u7279\u5b9a\u503c;\u4f8b\u5982\u3002genericTypeMappings<\/code>typeName<\/code>sObject<\/code>\u2018T__param1\u2019<\/code>typeValue<\/code>sObject<\/code>Account<\/code><\/p>\n\n\n\n
    [{\n    typeName: 'T__param1',\n    typeValue: 'Account'\n}]<\/code><\/pre>\n\n\n\n
    \u4e8b\u4ef6\u7c7b\u578b<\/h2>\n\n\n\n
    \u8981\u5411 Flow Builder \u62a5\u544a\u8f93\u5165\u503c\u66f4\u6539\uff0c\u8bf7\u4ece\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u7684\u51fd\u6570\u4e2d\u8c03\u5ea6\u4e8b\u4ef6\u3002\u8bbe\u7f6e\u4e3a \u548c true\u3002handleChange<\/code>bubbles<\/code>composed<\/code><\/p>\n\n\n\n
    \u4e8b\u4ef6\u7c7b\u578b\u7684\u6709\u6548\u503c\u4e3a\uff1a<\/p>\n\n\n\n
      \n
    • configuration_editor_input_value_changed<\/code>– \u4e00\u79cd\u4e8b\u4ef6\u7c7b\u578b\uff0c\u5728\u8f93\u5165\u503c\u66f4\u6539\u65f6\u8c03\u5ea6\u3002<\/li>\n\n\n\n
    • configuration_editor_input_value_deleted<\/code>– \u5220\u9664\u8f93\u5165\u503c\u65f6\u8c03\u5ea6\u7684\u4e8b\u4ef6\u7c7b\u578b\u3002<\/li>\n\n\n\n
    • configuration_editor_generic_type_mapping_changed<\/code>– \u4e00\u79cd\u4e8b\u4ef6\u7c7b\u578b\uff0c\u5728\u901a\u7528\u8f93\u5165\u503c\u66f4\u6539\u65f6\u8c03\u5ea6\u3002sObject<\/code><\/li>\n<\/ul>\n\n\n\n
      \u8fd9\u4e9b\u5c5e\u6027\u5b9a\u4e49\u7528\u4e8e\u62a5\u544a\u66f4\u6539\u7684\u8f93\u5165\u3002detail<\/code><\/p>\n\n\n\n
        \n
      • name<\/code>– \u5c4f\u5e55\u7ec4\u4ef6\u7684 JavaScript \u7c7b\u4e2d\u7684\u8f93\u5165\u53d8\u91cf\u3002<\/li>\n\n\n\n
      • newValue<\/code>– \u8f93\u5165\u7684\u65b0\u503c\u3002<\/li>\n\n\n\n
      • newValueDataType<\/code>– \u8f93\u5165\u7684\u65b0\u6570\u636e\u7c7b\u578b\u3002<\/li>\n\n\n\n
      • typeName<\/code>– \u5c4f\u5e55\u7ec4\u4ef6\u7684 JavaScript \u7c7b\u6216\u53ef\u8c03\u7528\u65b9\u6cd5\u7684 Apex \u7c7b\u4e2d\u7684\u6cdb\u578b\u8f93\u5165\u3002\u8981\u5728\u5c4f\u5e55\u7ec4\u4ef6\u7684\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u5f15\u7528 \uff0c\u8bf7\u5f15\u7528\u5b50\u6807\u8bb0\u7684\u5c5e\u6027\u3002\u8be5\u503c\u5fc5\u987b\u4f4d\u4e8e\u5927\u62ec\u53f7\u5185\uff0c\u4f8b\u5982\u3002\u8981\u5c06\u5c5e\u6027\u5b9a\u4e49\u4e3a\u6cdb\u578b\u96c6\u5408\u6570\u636e\u7c7b\u578b\uff0c\u8bf7\u8ffd\u52a0 \uff0c\u4f8b\u5982 \u3002\u8981\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u5f15\u7528\u53ef\u8c03\u7528\u64cd\u4f5c\u7684 \uff0c\u8bf7\u5728\u8f93\u5165\u540d\u79f0\u548c\u8f93\u51fa\u540d\u79f0\u524d\u9762\u52a0\u4e0a \uff0c\u4f8b\u5982 \u3002sObject<\/code>typeName<\/code>propertyType<\/code>name<\/code>property type=\"{T}\"<\/code>sObject<\/code>[]<\/code>property type=\"{T[]}\"<\/code>typeName<\/code>T__<\/code>U__<\/code>T__param1<\/code><\/li>\n\n\n\n
      • typeValue<\/code>– \u901a\u7528\u8f93\u5165\u6216\u8f93\u51fa\u7684\u7279\u5b9a\u503c\u3002sObject<\/code><\/li>\n<\/ul>\n\n\n\n
        \u4f8b\u5982\uff0c\u5f53\u7ba1\u7406\u5458\u5728\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u4e2d\u8f93\u5165\u503c for \u65f6\uff0c\u5b83\u4f1a\u8c03\u5ea6\u4e00\u4e2a\u4e8b\u4ef6\u3002Flow Builder \u63a5\u6536\u4e8b\u4ef6\u5e76\u66f4\u65b0\u6d41\u4e2d\u7684\u503c\u3002volume<\/code><\/p>\n\n\n\n
        handleChange(event) {\n    if (event && event.detail) {\n        const newValue = event.detail.value;\n        const valueChangedEvent = new CustomEvent(\n            'configuration_editor_input_value_changed', {\n            bubbles: true,\n            cancelable: false,\n            composed: true,\n            detail: {\n                name: 'volume',\n                newValue,\n                newValueDataType: 'Number'\n            }\n            }\n        );\n        this.dispatchEvent(valueChangedEvent);\n    }\n}<\/code><\/pre>\n\n\n\n
        \u6d41\u4e2d\u652f\u6301\u7684\u6570\u636e\u7c7b\u578b<\/h2>\n\n\n\n
        \u5e76\u975e\u6240\u6709\u81ea\u5b9a\u4e49 Lightning Web \u7ec4\u4ef6\u6570\u636e\u7c7b\u578b\u5728\u6d41\u7a0b\u4e2d\u90fd\u53d7\u652f\u6301\u3002\u60a8\u53ea\u80fd\u5728\u6d41\u7a0b\u548c\u81ea\u5b9a\u4e49 Lightning Web \u7ec4\u4ef6\u4e4b\u95f4\u6620\u5c04\u8fd9\u4e9b\u7c7b\u578b\u53ca\u5176\u5173\u8054\u7684\u96c6\u5408\u7c7b\u578b\u3002<\/p>\n\n\n\n
        \u6d41\u6570\u636e\u7c7b\u578b<\/th>Lightning Web \u7ec4\u4ef6\u6570\u636e\u7c7b\u578b<\/th>\u6709\u6548\u503c<\/th><\/tr><\/thead>
        Apex\uff08\u6d41\u91cf\u6807\u7b7e\uff1aApex-Defined\uff09<\/td>\u81ea\u5b9a\u4e49 Apex \u7c7b<\/td>\u5b9a\u4e49\u5b57\u6bb5\u7684 Apex \u7c7b\u3002Apex \u7c7b\u4e2d\u652f\u6301\u7684\u6570\u636e\u7c7b\u578b\u5305\u62ec Boolean\u3001Integer\u3001Long\u3001Decimal\u3001Double\u3001Date\u3001DateTime \u548c String\u3002\u6bcf\u79cd\u6570\u636e\u7c7b\u578b\u90fd\u652f\u6301\u5355\u4e2a\u503c\u548c\u5217\u8868\u3002@AuraEnabled<\/code><\/td><\/tr>
        \u5e03\u5c14<\/td>\u5e03\u5c14<\/td>\u771f\u5b9e\u503c\uff1atrue<\/code>1<\/code>\u7b49\u6548\u8868\u8fbe\u5f0fFalse \u503c\uff1afalse<\/code>0<\/code>\u7b49\u6548\u8868\u8fbe\u5f0f<\/td><\/tr>
        \u8d27\u5e01<\/td>\u6574\u6570<\/td>\u6570\u503c\u6216\u7b49\u6548\u8868\u8fbe\u5f0f<\/td><\/tr>
        \u65e5\u671f<\/td>\u65e5\u671f<\/td>\"YYYY-MM-DD\"<\/code>\u6216\u7b49\u6548\u8868\u8fbe\u5f0f<\/td><\/tr>
        DateTime\uff08\u6d41\u6807\u7b7e\uff1a\u65e5\u671f\/\u65f6\u95f4\uff09<\/td>\u65e5\u671f\u65f6\u95f4<\/td>\"YYYY-MM-DDThh:mm:ssZ\"<\/code>\u6216\u7b49\u6548\u8868\u8fbe\u5f0f<\/td><\/tr>
        \u6570<\/td>\u6570<\/td>\u6570\u503c\u6216\u7b49\u6548\u8868\u8fbe\u5f0f<\/td><\/tr>
        Multipicklist\uff08\u6d41\u6807\u7b7e\uff1aMulti-Select Picklist\uff09<\/td>\u5b57\u7b26\u4e32<\/td>\u5b57\u7b26\u4e32\u503c\u6216\u4f7f\u7528\u5206\u53f7\u5206\u9694\u683c\u5f0f\u7684\u7b49\u6548\u8868\u8fbe\u5f0f\uff1a\u201cBlue;\u7eff;\u9ec4\u8272\u201d<\/td><\/tr>
        \u9009\u62e9\u5217\u8868<\/td>\u5b57\u7b26\u4e32<\/td>\u5b57\u7b26\u4e32\u503c\u6216\u7b49\u6548\u8868\u8fbe\u5f0f<\/td><\/tr>
        sObject\uff08\u6d41\u6807\u7b7e\uff1a\u8bb0\u5f55\uff09<\/td>\u7279\u5b9a\u5bf9\u8c61\u7684 API \u540d\u79f0\uff0c\u4f8b\u5982 Account \u6216 Case<\/td>\u952e\u503c\u5bf9\u6216\u7b49\u6548\u8868\u8fbe\u5f0f\u7684\u6620\u5c04\u3002\u6d41\u8bb0\u5f55\u503c\u4ec5\u6620\u5c04\u5230\u7c7b\u578b\u4e3a\u7279\u5b9a\u5bf9\u8c61\u7684\u5c5e\u6027\u3002\u4f8b\u5982\uff0c\u5ba2\u6237\u8bb0\u5f55\u53d8\u91cf\u53ea\u80fd\u6620\u5c04\u5230\u7c7b\u578b\u4e3a Account \u7684\u5c5e\u6027\u3002\u6d41\u4e0d\u652f\u6301 Object \u6570\u636e\u7c7b\u578b\u3002<\/td><\/tr>
        \u5b57\u7b26\u4e32\uff08\u6d41\u6807\u7b7e\uff1a\u6587\u672c\uff09<\/td>\u5b57\u7b26\u4e32<\/td>\u5b57\u7b26\u4e32\u503c\u6216\u7b49\u6548\u8868\u8fbe\u5f0f<\/td><\/tr><\/tbody><\/table><\/figure>\n","protected":false},"excerpt":{"rendered":"
        \u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI
        \n\u5f00\u53d1\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u4e2d\u914d\u7f6e\u81ea\u5b9a\u4e49\u5c4f\u5e55\u7ec4\u4ef6\u6216\u53ef\u8c03\u7528\u64cd\u4f5c\u65f6\uff0c\u8be5\u7f16\u8f91\u5668\u53ef\u4e3a\u5176\u63d0\u4f9b\u7b80\u5316\u7684 UI\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u662f\u4e00\u4e2a Lightning Web \u7ec4\u4ef6\uff0c\u5b83\u63d0\u4f9b\u7528\u4e8e\u8f93\u5165\u8f93\u5165\u503c\u7684\u81ea\u5b9a\u4e49 UI\u3002<\/p>\n","protected":false},"author":1,"featured_media":3915,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[233],"tags":[258],"class_list":["post-3913","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-lightning-web-","tag--flow-builder--ui"],"yoast_head":"\n\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI - \u767d\u767d\u968f\u7b14<\/title>\n<meta name=\"description\" content=\"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI\u5f00\u53d1\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u4e2d\u914d\u7f6e\u81ea\u5b9a\u4e49\u5c4f\u5e55\u7ec4\u4ef6\u6216\u53ef\u8c03\u7528\u64cd\u4f5c\u65f6\uff0c\u8be5\u7f16\u8f91\u5668\u53ef\u4e3a\u5176\u63d0\u4f9b\u7b80\u5316\u7684 UI\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u662f\u4e00\u4e2a Lightning Web \u7ec4\u4ef6\uff0c\u5b83\u63d0\u4f9b\u7528\u4e8e\u8f93\u5165\u8f93\u5165\u503c\u7684\u81ea\u5b9a\u4e49 UI\u3002\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/www.ponybai.com\/?p=3913\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI - \u767d\u767d\u968f\u7b14\" \/>\n<meta property=\"og:description\" content=\"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI\u5f00\u53d1\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u4e2d\u914d\u7f6e\u81ea\u5b9a\u4e49\u5c4f\u5e55\u7ec4\u4ef6\u6216\u53ef\u8c03\u7528\u64cd\u4f5c\u65f6\uff0c\u8be5\u7f16\u8f91\u5668\u53ef\u4e3a\u5176\u63d0\u4f9b\u7b80\u5316\u7684 UI\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u662f\u4e00\u4e2a Lightning Web \u7ec4\u4ef6\uff0c\u5b83\u63d0\u4f9b\u7528\u4e8e\u8f93\u5165\u8f93\u5165\u503c\u7684\u81ea\u5b9a\u4e49 UI\u3002\" \/>\n<meta property=\"og:url\" content=\"http:\/\/www.ponybai.com\/?p=3913\" \/>\n<meta property=\"og:site_name\" content=\"\u767d\u767d\u968f\u7b14\" \/>\n<meta property=\"article:published_time\" content=\"2024-01-23T13:44:45+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-12-03T00:04:34+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/www.ponybai.com\/wp-content\/uploads\/2023\/12\/flow_custom_property_editor_none.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1188\" \/>\n\t<meta property=\"og:image:height\" content=\"631\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"ponybai\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"ponybai\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"http:\/\/www.ponybai.com\/?p=3913#article\",\"isPartOf\":{\"@id\":\"http:\/\/www.ponybai.com\/?p=3913\"},\"author\":{\"name\":\"ponybai\",\"@id\":\"http:\/\/www.ponybai.com\/#\/schema\/person\/935c7592c850c65e1e5eba4530dbf883\"},\"headline\":\"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI\",\"datePublished\":\"2024-01-23T13:44:45+00:00\",\"dateModified\":\"2023-12-03T00:04:34+00:00\",\"mainEntityOfPage\":{\"@id\":\"http:\/\/www.ponybai.com\/?p=3913\"},\"wordCount\":286,\"publisher\":{\"@id\":\"http:\/\/www.ponybai.com\/#\/schema\/person\/935c7592c850c65e1e5eba4530dbf883\"},\"keywords\":[\"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI\"],\"articleSection\":[\"Lightning Web \u7ec4\u4ef6\u5f00\u53d1\u4eba\u5458\u6307\u5357\"],\"inLanguage\":\"zh-Hans\"},{\"@type\":\"WebPage\",\"@id\":\"http:\/\/www.ponybai.com\/?p=3913\",\"url\":\"http:\/\/www.ponybai.com\/?p=3913\",\"name\":\"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI - \u767d\u767d\u968f\u7b14\",\"isPartOf\":{\"@id\":\"http:\/\/www.ponybai.com\/#website\"},\"datePublished\":\"2024-01-23T13:44:45+00:00\",\"dateModified\":\"2023-12-03T00:04:34+00:00\",\"description\":\"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI\u5f00\u53d1\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u4e2d\u914d\u7f6e\u81ea\u5b9a\u4e49\u5c4f\u5e55\u7ec4\u4ef6\u6216\u53ef\u8c03\u7528\u64cd\u4f5c\u65f6\uff0c\u8be5\u7f16\u8f91\u5668\u53ef\u4e3a\u5176\u63d0\u4f9b\u7b80\u5316\u7684 UI\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u662f\u4e00\u4e2a Lightning Web \u7ec4\u4ef6\uff0c\u5b83\u63d0\u4f9b\u7528\u4e8e\u8f93\u5165\u8f93\u5165\u503c\u7684\u81ea\u5b9a\u4e49 UI\u3002\",\"breadcrumb\":{\"@id\":\"http:\/\/www.ponybai.com\/?p=3913#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/www.ponybai.com\/?p=3913\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/www.ponybai.com\/?p=3913#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"http:\/\/www.ponybai.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI\"}]},{\"@type\":\"WebSite\",\"@id\":\"http:\/\/www.ponybai.com\/#website\",\"url\":\"http:\/\/www.ponybai.com\/\",\"name\":\"\u767d\u767d\u968f\u7b14\",\"description\":\"Salesforce\u5b98\u65b9\u8bb2\u5e08\",\"publisher\":{\"@id\":\"http:\/\/www.ponybai.com\/#\/schema\/person\/935c7592c850c65e1e5eba4530dbf883\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"http:\/\/www.ponybai.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"zh-Hans\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"http:\/\/www.ponybai.com\/#\/schema\/person\/935c7592c850c65e1e5eba4530dbf883\",\"name\":\"ponybai\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"http:\/\/www.ponybai.com\/#\/schema\/person\/image\/\",\"url\":\"http:\/\/www.ponybai.com\/wp-content\/uploads\/2025\/03\/cropped-Ihsans-WeChatQR.jpg\",\"contentUrl\":\"http:\/\/www.ponybai.com\/wp-content\/uploads\/2025\/03\/cropped-Ihsans-WeChatQR.jpg\",\"width\":248,\"height\":248,\"caption\":\"ponybai\"},\"logo\":{\"@id\":\"http:\/\/www.ponybai.com\/#\/schema\/person\/image\/\"},\"sameAs\":[\"http:\/\/121.37.188.161\"],\"url\":\"http:\/\/www.ponybai.com\/?author=1\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI - \u767d\u767d\u968f\u7b14","description":"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI\u5f00\u53d1\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u4e2d\u914d\u7f6e\u81ea\u5b9a\u4e49\u5c4f\u5e55\u7ec4\u4ef6\u6216\u53ef\u8c03\u7528\u64cd\u4f5c\u65f6\uff0c\u8be5\u7f16\u8f91\u5668\u53ef\u4e3a\u5176\u63d0\u4f9b\u7b80\u5316\u7684 UI\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u662f\u4e00\u4e2a Lightning Web \u7ec4\u4ef6\uff0c\u5b83\u63d0\u4f9b\u7528\u4e8e\u8f93\u5165\u8f93\u5165\u503c\u7684\u81ea\u5b9a\u4e49 UI\u3002","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"http:\/\/www.ponybai.com\/?p=3913","og_locale":"zh_CN","og_type":"article","og_title":"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI - \u767d\u767d\u968f\u7b14","og_description":"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI\u5f00\u53d1\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u4e2d\u914d\u7f6e\u81ea\u5b9a\u4e49\u5c4f\u5e55\u7ec4\u4ef6\u6216\u53ef\u8c03\u7528\u64cd\u4f5c\u65f6\uff0c\u8be5\u7f16\u8f91\u5668\u53ef\u4e3a\u5176\u63d0\u4f9b\u7b80\u5316\u7684 UI\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u662f\u4e00\u4e2a Lightning Web \u7ec4\u4ef6\uff0c\u5b83\u63d0\u4f9b\u7528\u4e8e\u8f93\u5165\u8f93\u5165\u503c\u7684\u81ea\u5b9a\u4e49 UI\u3002","og_url":"http:\/\/www.ponybai.com\/?p=3913","og_site_name":"\u767d\u767d\u968f\u7b14","article_published_time":"2024-01-23T13:44:45+00:00","article_modified_time":"2023-12-03T00:04:34+00:00","og_image":[{"width":1188,"height":631,"url":"http:\/\/www.ponybai.com\/wp-content\/uploads\/2023\/12\/flow_custom_property_editor_none.png","type":"image\/png"}],"author":"ponybai","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"ponybai","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"5 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"http:\/\/www.ponybai.com\/?p=3913#article","isPartOf":{"@id":"http:\/\/www.ponybai.com\/?p=3913"},"author":{"name":"ponybai","@id":"http:\/\/www.ponybai.com\/#\/schema\/person\/935c7592c850c65e1e5eba4530dbf883"},"headline":"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI","datePublished":"2024-01-23T13:44:45+00:00","dateModified":"2023-12-03T00:04:34+00:00","mainEntityOfPage":{"@id":"http:\/\/www.ponybai.com\/?p=3913"},"wordCount":286,"publisher":{"@id":"http:\/\/www.ponybai.com\/#\/schema\/person\/935c7592c850c65e1e5eba4530dbf883"},"keywords":["\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI"],"articleSection":["Lightning Web \u7ec4\u4ef6\u5f00\u53d1\u4eba\u5458\u6307\u5357"],"inLanguage":"zh-Hans"},{"@type":"WebPage","@id":"http:\/\/www.ponybai.com\/?p=3913","url":"http:\/\/www.ponybai.com\/?p=3913","name":"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI - \u767d\u767d\u968f\u7b14","isPartOf":{"@id":"http:\/\/www.ponybai.com\/#website"},"datePublished":"2024-01-23T13:44:45+00:00","dateModified":"2023-12-03T00:04:34+00:00","description":"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI\u5f00\u53d1\u4e00\u4e2a\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\uff0c\u5f53\u7ba1\u7406\u5458\u5728 Flow Builder \u4e2d\u914d\u7f6e\u81ea\u5b9a\u4e49\u5c4f\u5e55\u7ec4\u4ef6\u6216\u53ef\u8c03\u7528\u64cd\u4f5c\u65f6\uff0c\u8be5\u7f16\u8f91\u5668\u53ef\u4e3a\u5176\u63d0\u4f9b\u7b80\u5316\u7684 UI\u3002\u81ea\u5b9a\u4e49\u5c5e\u6027\u7f16\u8f91\u5668\u662f\u4e00\u4e2a Lightning Web \u7ec4\u4ef6\uff0c\u5b83\u63d0\u4f9b\u7528\u4e8e\u8f93\u5165\u8f93\u5165\u503c\u7684\u81ea\u5b9a\u4e49 UI\u3002","breadcrumb":{"@id":"http:\/\/www.ponybai.com\/?p=3913#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["http:\/\/www.ponybai.com\/?p=3913"]}]},{"@type":"BreadcrumbList","@id":"http:\/\/www.ponybai.com\/?p=3913#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"http:\/\/www.ponybai.com\/"},{"@type":"ListItem","position":2,"name":"\u5728 Flow Builder \u4e2d\u81ea\u5b9a\u4e49\u64cd\u4f5c\u548c\u5c4f\u5e55\u7ec4\u4ef6 UI"}]},{"@type":"WebSite","@id":"http:\/\/www.ponybai.com\/#website","url":"http:\/\/www.ponybai.com\/","name":"\u767d\u767d\u968f\u7b14","description":"Salesforce\u5b98\u65b9\u8bb2\u5e08","publisher":{"@id":"http:\/\/www.ponybai.com\/#\/schema\/person\/935c7592c850c65e1e5eba4530dbf883"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"http:\/\/www.ponybai.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"zh-Hans"},{"@type":["Person","Organization"],"@id":"http:\/\/www.ponybai.com\/#\/schema\/person\/935c7592c850c65e1e5eba4530dbf883","name":"ponybai","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"http:\/\/www.ponybai.com\/#\/schema\/person\/image\/","url":"http:\/\/www.ponybai.com\/wp-content\/uploads\/2025\/03\/cropped-Ihsans-WeChatQR.jpg","contentUrl":"http:\/\/www.ponybai.com\/wp-content\/uploads\/2025\/03\/cropped-Ihsans-WeChatQR.jpg","width":248,"height":248,"caption":"ponybai"},"logo":{"@id":"http:\/\/www.ponybai.com\/#\/schema\/person\/image\/"},"sameAs":["http:\/\/121.37.188.161"],"url":"http:\/\/www.ponybai.com\/?author=1"}]}},"_links":{"self":[{"href":"http:\/\/www.ponybai.com\/index.php?rest_route=\/wp\/v2\/posts\/3913","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.ponybai.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.ponybai.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.ponybai.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.ponybai.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3913"}],"version-history":[{"count":2,"href":"http:\/\/www.ponybai.com\/index.php?rest_route=\/wp\/v2\/posts\/3913\/revisions"}],"predecessor-version":[{"id":3925,"href":"http:\/\/www.ponybai.com\/index.php?rest_route=\/wp\/v2\/posts\/3913\/revisions\/3925"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/www.ponybai.com\/index.php?rest_route=\/wp\/v2\/media\/3915"}],"wp:attachment":[{"href":"http:\/\/www.ponybai.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3913"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.ponybai.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3913"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.ponybai.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3913"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}