物联网软件_物联网和物联网

国际 虚拟云 浏览

小编:新闻编辑室回到编辑室Vlocity用户界面架构师Matt Goldspink分享了如何开始使用Salesforce Lightning Web组件在Vlocity,Matt Goldspink专注于使用Salesforce的闪电技术开发漂亮的用户界面,随着Salesf

新闻编辑室回到编辑室Vlocity用户界面架构师Matt Goldspink分享了如何开始使用Salesforce Lightning Web组件在Vlocity,Matt Goldspink专注于使用Salesforce的闪电技术开发漂亮的用户界面,随着Salesforce宣布对平台进行令人兴奋的更改,web开发总体上变得更加有趣。2019年1月16日Matt Goldspink首席工程师读7分钟作者:Vlocity首席工程师兼UI架构师Matt GoldspinkLightning Web组件(或LWC)这是一种使用现代web标准在Salesforce平台上编写UI代码的新方法。这意味着作为web开发人员,我们最终可以编写标准的HTML、DOM和JavaScript,而几乎没有专有语法。我说的是纯es6javascript类、import语句、普通DOM事件、模板DOM节点等等!在这篇文章中,我将介绍如何开始使用Salesforce上的第一个Lightning Web组件。1获得Salesforce组织首先转到https://www.salesforce.com/form/signup/prerelease-spring19/注册一个预发布的"开发人员"组织(确保在最后一步中选择了"开发人员")。您将收到一封确认电子邮件以验证您的帐户。点击链接并设置密码。你应该登录到你的组织的设置屏幕。使用左侧边栏上的"快速搜索",输入"Dev Hub"并选择"Dev Hub"选项。2安装Salesforce DX CLI工具CLI工具将帮助您将代码部署到组织。安装位置:https://developer.salesforce.com/tools/sfdxcli我们现在需要使用工具的预发布版本,而LWC处于预发布阶段。您需要打开命令提示符/终端并输入以下内容:sfdx公司插件:安装salesforcedx@pre-release这将安装dx的预发行版本,该版本应为45.0.12或更高版本。您可以通过运行以下命令来验证:sfdx插件SalesforceDX有很多很酷的特性。我强烈建议遵循DX Trailhead入门指南三。安装Visual Studio代码下一步我们将使用visualstudio代码来编写组件。虽然有其他编辑器在那里,Salesforce已经编写了一些插件来简化LWC的开发。从以下位置下载最新版本:https://code.visualstudio.com/。安装并运行后,单击左侧边栏中的Extensions图标,您将需要安装2个扩展:Salesforce扩展包Lightning Web组件安装这些程序后,您需要重新启动VisualStudio代码,请单击蓝色的"重新启动"按钮。如果安装正确,您应该会看到与此类似的列表:4创建我们的第一个项目现在有了插件安装,我们可以开始我们的项目!首先,我们将使用该工具引导一个新的项目。在Mac上按Command+Shift+P,在Windows上按Ctrl+Shift+P,然后在框中键入"sfdx:create project"。它将提示您输入项目名称,我选择了MyFirstLWCProject和一个文件夹来放置项目:现在让我们写一些代码。在Mac上按Command+Shift+P,在Windows上按Ctrl+Shift+P,然后输入"sfdx:create lightning web component",按enter键选择建议的目录并将其命名为"helloComponent":从这里打开helloComponent.html归档并输入:在helloComponent.js将内容替换为:最后,我们需要更新helloComponent.js-元数据.xml有:现在保存所有更改,我们准备将代码部署到我们的组织。5连接到我们的组织我们需要将Visual Studio代码连接到我们的组织,因此首先需要授权我们新创建的开发人员中心。在Mac上按Command+Shift+P,在Windows上按Ctrl+Shift+P,然后输入"sfdx:authorize a Dev Hub",这将启动浏览器并要求您使用新创建的Salesforce org登录。如果您不记得用户名,请检查您发送的带有验证链接的电子邮件:登录后返回到Visual Studio代码,下一步我们将创建一个要使用的临时组织。在Mac上按Command+Shift+P,在Windows上按Ctrl+Shift+P,然后输入"sfdx:创建默认临时组织"。点击enter为projectscratch设置默认值-定义.json然后输入名称myfirstlwcstratchorg。这通常需要一分钟左右才能完成。6将代码推送到组织现在我们准备把代码推送到组织。在Mac上按Command+Shift+P,在Windows上按Ctrl+Shift+P(这将很快成为肌肉内存!),然后键入"sfdx:push source to default scratch org"7在组织中查看推后,我们可以在org中查看它,在Mac上按Command+Shift+P,在Windows上按Ctrl+Shift+P,然后键入"sfdx:opendefaultorg"。这将在您的浏览器中打开该组织。点击左上角的应用程序启动程序并选择"销售"应用程序。点击右上角的"齿轮"图标,选择"编辑页面"。这将打开appbuilder,使用左栏中的搜索并键入"helloComponent"。将组件拖放到右栏顶部中间的画布上。最后点击"保存",这将询问你是否想激活这个页面作为组织中的默认页面。点击"激活",然后点击"分配为组织默认值"。然后在App Builder中最后一次点击Save,然后再点击Back。现在,如果看不到组件,请刷新浏览器选项卡。之后,您应该看到您的第一个Lightning Web组件!尝试更改输入框中的文本,您应该会看到消息中的文本也会更新!请求演示阅读更多思想领导销售人员Lightning Web组件

当前网址:http://www.vmchk.com/icon/8639.html

 
你可能喜欢的: