检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
对接CSS提供云搜索服务 背景信息 云搜索服务（Cloud Search Service，简称CSS），为您提供托管的分布式搜索引擎服务，完全兼容开源Elasticsearch搜索引擎，支持结构化、非结构化文本的多条件检索、统计、报表。
对接CSS实现在应用中调用分布式搜索 云搜索服务（Cloud Search Service，简称CSS），为您提供托管的分布式搜索引擎服务，完全兼容开源Elasticsearch搜索引擎，支持结构化、非结构化文本的多条件检索、统计、报表。
仪表板开发实例 场景描述 监控用户增长在电商中有很普遍的意义，根据每天新增用户数进行预警，连续一个月对用户增长数量趋势曲线的观察，可以对每天营销情况进行回顾。 前提条件 参考创建和使用对象模型中操作，创建对象“Account”，且在对象的“基本信息”页面勾选“允许报表使用”。
样式类：当前组件使用的CSS样式类名，可在CSS代码中进行引用。 父主题： 设置AstroZero标准页面组件属性
目录结构如图3所示，其中userLogin.js文件是写vue业务逻辑的代码，userLogin.ftl用于写html代码，userLogin.css用于写样式代码，userLogin.editor.js以及packageinfo.json是配置文件。
若勾选“合并并压缩资源”，会对所有高级页面涉及的css和js文件进行合并及压缩，使用单页面性能检查功能时，不要勾选该选项。 图1 关闭“合并并压缩资源”属性 设置完成后，单击，并单击，释放锁。
自定义主题样式需要您熟悉CSS的Less代码编写规范，关于Less介绍，请参见Less介绍。 自定义主题样式 参考登录AstroZero新版应用设计器中操作，登录应用设计器。 例如，在标准页面中添加一个“表单”组件，如何添加组件请参见为AstroZero标准页面添加组件。
图18 “录入分隔比例”为“6:12:6” 高级设置 对于有丰富页面开发经验的用户，在“样式 > 布局”面板中可以实现对页面CSS属性直接配置。甚至在“高级设置”中，直接编写CSS代码进行更深度的个性化布局定制，如图19。
图1 启用主题前标准页面预览效果 前提条件 请先熟悉CSS的Less代码编写规范。 操作步骤 参考如何进入经典开发环境中操作，进入经典版开发环境。 在“首页 > 项目 > 我的应用”中，单击对应的应用，进入应用开发页面。 在页面左下角，选择“配置”，进入应用配置页面。
添加库扩展AstroZero标准页面功能 如果您希望使用第三方库文件，而当前系统中不存在该库，您可以通过上传，新增该JS/CSS库，并在页面中设计并使用该库，实现引入第三方库的功能。 什么是库 库是指在设计页面时，需要依赖的库，如果缺少相应的依赖库，则页面中无法实现某些功能。
站点设置 合并并压缩资源：勾选后，在发布该应用时，对应用中所有高级页面涉及的css和js文件进行合并及压缩，这样可以有效降低运行时服务器压力，但从终端浏览器首次访问该站点页面时，访问时间会稍微增加。 资源延迟加载：勾选后，在body标签中加载资源。
如何引入第三方库 如果您希望使用第三方库文件，而当前系统中不存在该库，您可以通过上传，新增该JS/CSS库，并在页面中设计并使用该库，实现引入第三方库的功能。本节将介绍如何引入并使用第三方库的具体操作步骤。
DOM和CSS样式调试 在Elements面板，可以自由的操作DOM和CSS，来迭代布局和设计页面。在开发者工具打开的状态下，使用左上角的箭头按钮，可点选页面元素，查看该元素DOM和CSS等。
例如，MintUI库需要引入文件“js/index.js”和“css/index.css”，请在packageinfo.json中添加这两个文件的描述。其中，“js”和“css”用于定义文件类型，“name”用于定义文件路径及名称。
DOM和CSS样式调试 在Elements面板，可以自由的操作DOM和CSS，来迭代布局和设计页面。在开发者工具打开的状态下，使用左上角的箭头按钮，可点选页面元素，查看该元素DOM和CSS等。
例如，MintUI库需要引入的文件有“js/index.js”和“css/index.css”文件，请在packageinfo.json中添加这两个文件的描述，如下所示。其中，“js”和“css”定义文件类型，“name”定义文件路径及名称。
例如，MintUI库需要引入的文件有“js/index.js”和“css/index.css”文件，请在packageinfo.json中添加这两个文件的描述，如下所示。其中，“js”和“css”定义文件类型，“name”定义文件路径及名称。
例如，MintUI库需要引入文件“js/index.js”和“css/index.css”，请在packageinfo.json中添加这两个文件的描述。其中，“js”和“css”用于定义文件类型，“name”用于定义文件路径及名称。
样式类：当前组件使用的CSS样式类名，可在CSS代码中进行引用。 父主题： 设置AstroZero标准页面组件属性
样式类：当前组件使用的CSS样式类名，可在CSS代码中进行引用。 父主题： 设置AstroZero标准页面组件属性
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
