DEX475

课程介绍

好了，今天我们来看一个非常实用的知识点：怎么通过一个简单的配置文件，让你的 Lightning Web 组件在不同的 Salesforce 界面里都能使用。 你开发的每一个 LWC 组件，除了那个 .js 和 .html 文件之外，还有一个名字后面带着 .js-meta.xml 的配置文件。这个文件里的元数据，就像是组件的“身份证”和“许可证”。你告诉 Salesforce：“我这个组件可以放到哪些地方去。” 在这个配置文件里，有一个特别重要的节点，叫 targets，就是目标。你在这里列出你允许这个组件出现的位置。现在可以选的目标还真不少，比如最常见的 Lightning 应用构建器，也就是你拖拖拽拽搭建页面那个工具；还有 Experience Builder，就是建客户社区门户用的。如果你做流程自动化，也可以让组件出现在 Flow Builder 的屏幕流程里。还有 Email Builder 里也能用，这样你就能在邮件内容里插入自定义组件。做数据分析的 CRM Analytics 仪表板、自定义选项卡、控制台应用里的侧边栏、快速操作、甚至在 Outlook 和 Gmail 的集成面板里，都可以通过配置目标来开放。 对了，如果你做的组件要打包放到 AppExchange 上分发，那这个配置文件还会关系到命名空间前缀，以及你是否把组件暴露出去，也就是 isExposed 这个设置。如果 isExposed 没设为 true，哪怕你写了 target，用户在构建器里也搜不到你的组件。此外，假如你想通过 Apex 代码做一些许可控制，也跟这里的设定有关。 还有一点特别好用，就是组件能够感知自己当前所在的环境。你只要在 JS 里用 @api 装饰器声明几个属性，就可以拿到页面上的上下文信息。比如用 @api recordId 就能拿到当前记录页面上那条记录的 ID，用 @api objectApiName 能拿到对象名，比如是 Account 还是 Contact。用 @api flexipageRegionWidth 还能知道当前组件所在区域的宽度，这样你可以做响应式布局。 除了这些常规目标，有两个比较特殊的环境值得注意。一个是在预测页面里，你可以让组件订阅消息通道，实时更新预测数据；另一个是邮件内容构建器，它环境很受限，不能加载外部资源，所以你得确保组件轻量又安全。 其实，我们这一整章的核心，就是让你彻底掌握如何通过 .js-meta.xml 这个配置界面，来控制组件在 Salesforce 里的部署范围和行为。也就是说，写好一个功能组件只是第一步，通过这个配置文件，你才能真正让它出现在正确的地方，给别人用起来。

课程章节

本课程共有 4 个章节

• 1

  Managed Packages — Add, Configure & Licensing

  第 325 页

  好，我们来聊聊托管包和AppExchange分发的一些关键点。你把它想象成把自己的组件打包成商品，放到官方商店去卖，这个打包方式就叫托管包，AppExchange就是它的分发渠道。 现在推荐用第二代托管包，也就是2GP，这是比较现代的做法。包发布以后，组件的名字就锁死了，不能再改，但有些元数据是可以编辑的，比如API版本、描述、标签这些。还有个属性叫isExposed，只能从false改成true，反过来不行。另外像目标配置masterLabel、targetConfig相关的targets这些也能调整。 这里要特别留意isExposed这个开关，它控制着组件能不能在Lightning App Builder这类工具里被看到和使用。如果isExposed是false，组件锁得没那么死，你可以随便删除它的目标和属性。但一旦isExposed设为true，而且包已经发布了，那目标和@api属性就永久锁定了，不能删不能改，不然会破坏已有部署。 还有个常见的坑是关于许可检查的。Lightning Web Components本身不会自动去验证用户有没有买你们包的授权。如果你是ISV合作伙伴，得自己在Apex里用userinfo.isClientUserLicensed这个方法来手动判断，发现用户没授权就得显示合适的提示消息，不能让他们白用。 那如果确实需要删除一个已经暴露出去的组件怎么办？对于isExposed=true的组件，得用两步走的删除流程，先让组件不可用，再在后续版本里彻底移除。而且注意，已经安装到客户组织里的组件还是会留在那里，成为所谓的“收件箱组件”，删不掉的。 你们在自己代码里引用托管包里的组件时，要注意加命名空间前缀，然后用短横线连接的小写形式，也就是kebab-case。比如你的命名空间是abc，一个叫mycomponent的组件，就写成abc-my-component这样引用。 最后别忘了，包发布前一定要同时用NPS和LWS两种模式做好测试，确保在不同运行环境里都没问题。这些点都记牢，以后发包就能少踩坑了。

  ▶ 播放视频 查看详情
• 2

  CRM Analytics & Record/Object Context

  第 326 页

  同学们，今天我们来聊聊LWC里和CRM Analytics仪表板相关的一些上下文属性和配置。这让你的组件能在不同的地方智能地获取数据，显示合适的界面。 首先，如果你要开发一个仪表板组件，必须把目标类型设为Analytics__Dashboard。这样才能和仪表板框架对接。还有一个可选参数叫hasStep，设成true，组件就能从查询步骤里拿到绑定的数据，跟仪表板的查询结果联动。 接着，我们有两种特殊的属性类型：测量和维度。测量（measure）是数值型的，比如销售额；维度（dimension）是分类的，比如地区。通过这些属性，仪表板编辑器就能选择查询结果里的列，直接映射给组件，非常方便。 然后看记录上下文。在 LWC 里，我们经常用 @api recordId 来接收当前记录的 ID。在 Lightning 体验里的标准记录页面上，这个值会自动填好，是一个18位的字符串。但如果你的组件放在体验云、也就是Experience Builder里，recordId 不会自动来，你得手动配置成 {!recordId} 表达式，它才会帮你取到。 对象上下文也类似，用 @api objectApiName 来感知当前正在操作哪个对象。在Flex页面里它会自动设置，但在体验构建器中，你也要手动指定成 {!objectApiName} 表达式才行。 还有组件宽度的问题。在不同页面区域里，组件可用宽度不同。用 @api flexipageRegionRange 属性，就能收到 SMALL、MEDIUM 或 LARGE 这种枚举值，再配合 CSS 类选择器，就能让组件在窄栏、宽栏里渲染不同的样式。 最后特别提醒一句：recordId 并不是处处自动。它只在显式的记录上下文里自己填充，比如记录详情页。假如你的组件用在全局快速操作、或其他非记录上下文，记着手动传一个 recordId 进去，不然它会是空的。 掌握了这些，你的仪表板组件就能灵活适应各种场景了。好，这节课先到这儿，咱们下回见。

  ▶ 播放视频 查看详情
• 3

  Forecasts Pages & Custom Tabs

  第 327 页

  同学们，咱们来看这一页幻灯片，它主要讲的是如何让 Lightning Web Component 用在预测页面里，还有怎么把组件变成一个独立的选项卡。 先说预测页面。如果你想把自己的组件放到销售预测的那个页面上，就需要在组件的配置里用到一个特殊的目标，叫做 `lightning__ForecastingPage`。用这个目标后，咱们的组件就可以自动订阅一个叫 `lightning__forecasting_flexipageUpdate` 的消息通道。它有什么用呢？当预测页面的标题发生变化——比如更换了所有权人，或者切换了预测类型——页面就会通过这个通道广播一条消息。咱们的组件收到消息，就能立即做出反应，更新显示内容。不过要记住一点：预测页面不支持接收咱们自定义组件发出的自定义事件。也就是说，你可以从

  ▶ 播放视频 查看详情
• 4

  Email Content Builder — Configuration & Restrictions

  第 328 页

  同学们，今天我们来聊聊一个非常特别的Lightning Web组件——电子邮件内容生成器。它在Salesforce里可不是普通的组件，因为它的运行环境非常受限，就像被关在一个小房间里，很多东西都不让你用。 你想啊，通常我们做LWC，可以操作DOM，可以调用Apex，可以用fetch去拿数据，还能用各种现成的lightning-base组件。但在这个电子邮件内容生成器里，大部分都不支持。比如，你不能直接操作DOM API，不能用fetch去网络上抓数据，不能用脚本标签，甚至window对象也没有。就连我们常用的 @wire 来调用Apex，也基本不行，只有极少数的Apex类是开放的。还有渲染回调renderedCallback，其实也不让用——但有一个特例，就是设置innerHTML的时候，可以例外。 那这个组件里，我们能用什么呢？支持的属性类型很固定：字符串、布尔值，还有一些设计相关的像颜色、字形、水平线、垂直线这些。所以如果你想往邮件里放自定义的HTML内容，怎么办呢？你需要在一个特定的元素上，设置两个属性：isHtmlContainer='true' 和 lwc:dom='manual'。这样组件就知道，哦，这块内容要当作HTML来处理，而且你要手动控制DOM。 在代码设计上，常见的模式是这样：用一对getter和setter来管理HTML值。比如定义一个私有变量保存HTML字符串，然后通过getter暴露出去，setter在接收到新值时，去更新对应的DOM元素。那第一次加载的时候，因为renderedCallback是特例允许的，你可以在里面把初始的HTML设置到元素的innerHTML里。后续当数据变化时，setter就会负责更新innerHTML，保持内容同步。 最后部署的时候，我们也得用sf CLI命令，先把源代码转换成适合部署的格式，然后部署到测试组织里去测试。整个过程要特别小心，因为安全限制太多了，一不小心就会踩坑。 好，这就是电子邮件内容生成器的特殊之处。记住，它就像在一个高度安全、功能受限的小隔间工作，但只要我们掌握了规律，一样可以做出漂亮的邮件内容。

  ▶ 播放视频 查看详情