From 758f164f60544db4aef16994bd6d0802aa8ba509 Mon Sep 17 00:00:00 2001 From: liubin <2115360251@qq.com> Date: Mon, 14 Jul 2025 23:05:47 +0800 Subject: [PATCH 1/3] feat(service): wip add the attributes of the tag --- .../language-service/src/data/template.ts | 1465 ++++++++++++++++- 1 file changed, 1445 insertions(+), 20 deletions(-) diff --git a/packages/language-service/src/data/template.ts b/packages/language-service/src/data/template.ts index 45bad70..bcdfd4b 100644 --- a/packages/language-service/src/data/template.ts +++ b/packages/language-service/src/data/template.ts @@ -16,7 +16,31 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: '', }, - attributes: [], + attributes: [ + { + name: 'is', + description: { + kind: 'markdown', + value: + '指定要使用的模板名称,可以是一个字符串或一个表达式。\n\n- **注意**:如果是字符串,则必须与 `name` 属性的值相同;如果是表达式,则必须返回一个字符串。', + }, + }, + { + name: 'name', + description: { + kind: 'markdown', + value: '定义模版的名称,作为唯一标识。', + }, + }, + { + name: 'data', + description: { + kind: 'markdown', + value: + '定义模版的初始数据,类型为对象。可以在模版中使用 `{{data.xxx}}` 来访问这些数据。', + }, + }, + ], references: [ { name: MpxDocs, url: `${MpxGuideUrl}/basic/template.html` }, ], @@ -27,7 +51,37 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: `视图容器。\n\n- **注意**:如果需要使用滚动视图,请使用 [scroll-view](${WxCompUrl}/scroll-view.html)。\n\n- 支持 Mpx 跨端输出 RN 的基础组件。`, }, - attributes: [], + attributes: [ + { + name: 'hover-class', + description: { + kind: 'markdown', + value: + '指定按下去的样式类。当 hover-class="none" 时,没有点击态效果', + }, + }, + { + name: 'hover-stop-propagation', + description: { + kind: 'markdown', + value: '指定是否阻止本节点的祖先节点的点击事件。', + }, + }, + { + name: 'hover-start-time', + description: { + kind: 'markdown', + value: '按住后多久出现点击态,单位毫秒,默认50ms。', + }, + }, + { + name: 'hover-stay-time', + description: { + kind: 'markdown', + value: '手指松开后点击态保留时间,单位毫秒,默认400ms。', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/view.html` }, { name: RNBasicComp, url: `${MpxRNCompUrl}view` }, @@ -39,7 +93,231 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: `可滚动视图区域。\n\n- 支持 Mpx 跨端输出 RN 的基础组件。`, }, - attributes: [], + attributes: [ + { + name: 'scroll-x', + description: { + kind: 'markdown', + value: '是否支持横向滚动,默认不支持。', + }, + }, + { + name: 'scroll-y', + description: { + kind: 'markdown', + value: '是否支持纵向滚动,默认不支持。', + }, + }, + { + name: 'upper-threshold', + description: { + kind: 'markdown', + value: + '距离顶部/左边多远时(单位 px)触发scrolltoupper事件,默认50。', + }, + }, + { + name: 'lower-threshold', + description: { + kind: 'markdown', + value: + '距离底部/右边多远时(单位 px)触发scrolltolower事件,默认50。', + }, + }, + { + name: 'scroll-top', + description: { + kind: 'markdown', + value: '设置竖向滚动条位置。', + }, + }, + { + name: 'scroll-left', + description: { + kind: 'markdown', + value: '设置横向滚动条位置。', + }, + }, + { + name: 'scroll-into-view', + description: { + kind: 'markdown', + value: + '值应为某子元素id(id不能以数字开头)。设置哪个方向可滚动,则在哪个方向滚动到该元素。', + }, + }, + { + name: 'scroll-into-view-offset', + description: { + kind: 'markdown', + value: '跳转到scroll-into-view目标节点时的额外偏移,默认值为0。', + }, + }, + { + name: 'scroll-with-animation', + description: { + kind: 'markdown', + value: '是否在设置滚动条位置时使用动画过渡,默认不使用。', + }, + }, + { + name: 'enable-back-to-top', + description: { + kind: 'markdown', + value: + 'iOS点击顶部状态栏、安卓双击标题栏时,滚动条返回顶部,只支持竖向,默认不使用。', + }, + }, + { + name: 'enable-passive', + description: { + kind: 'markdown', + value: '开启passive特性,能优化一定的滚动性能。', + }, + }, + { + name: 'refresher-enabled', + description: { + kind: 'markdown', + value: '是否开启下拉刷新功能,默认不使用。', + }, + }, + { + name: 'refresher-threshold', + description: { + kind: 'markdown', + value: '设置自定义下拉刷新阈值,默认45。', + }, + }, + { + name: 'refresher-default-style', + description: { + kind: 'markdown', + value: + '设置自定义下拉刷新默认样式,支持设置 black | white | none, none 表示不使用默认样式.', + }, + }, + { + name: 'refresher-background', + description: { + kind: 'markdown', + value: '设置自定义下拉刷新区域背景颜色,默认为透明。', + }, + }, + { + name: 'refresher-triggered', + description: { + kind: 'markdown', + value: + '设置当前下拉刷新状态,true 表示下拉刷新已经被触发,false 表示下拉刷新未被触发.', + }, + }, + { + name: 'bounces', + description: { + kind: 'markdown', + value: + 'iOS 下 scroll-view 边界弹性控制 (同时开启 enhanced 属性后生效)。', + }, + }, + { + name: 'show-scrollbar', + description: { + kind: 'markdown', + value: '滚动条显隐控制 (同时开启 enhanced 属性后生效)。', + }, + }, + { + name: 'fast-deceleration', + description: { + kind: 'markdown', + value: + '滑动减速速率控制, 仅在 iOS 下生效 (同时开启 enhanced 属性后生效)。', + }, + }, + { + name: 'binddragstart', + description: { + kind: 'markdown', + value: + '滑动开始事件 (同时开启 enhanced 属性后生效) detail { scrollTop, scrollLeft }。', + }, + }, + { + name: 'binddragging', + description: { + kind: 'markdown', + value: + '滑动事件 (同时开启 enhanced 属性后生效) detail { scrollTop, scrollLeft }。', + }, + }, + { + name: 'binddragend', + description: { + kind: 'markdown', + value: + '滑动结束事件 (同时开启 enhanced 属性后生效) detail { scrollTop, scrollLeft, velocity }。', + }, + }, + { + name: 'bindscrolltoupper', + description: { + kind: 'markdown', + value: '滚动到顶部/左边时触发。', + }, + }, + { + name: 'bindscrolltolower', + description: { + kind: 'markdown', + value: '滚动到底部/右边时触发。', + }, + }, + { + name: 'bindscroll', + description: { + kind: 'markdown', + value: + '滚动时触发,event.detail = { scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY }。', + }, + }, + { + name: 'bindrefresherpulling', + description: { + kind: 'markdown', + value: '自定义下拉刷新控件被下拉。', + }, + }, + { + name: 'bindrefresherrefresh', + description: { + kind: 'markdown', + value: '自定义下拉刷新控件被触发。', + }, + }, + { + name: 'bindrefresherrestore', + description: { + kind: 'markdown', + value: '自定义下拉刷新控件被恢复。', + }, + }, + { + name: 'bindrefresherabort', + description: { + kind: 'markdown', + value: '自定义下拉刷新控件被中止。', + }, + }, + { + name: 'scroll-anchoring', + description: { + kind: 'markdown', + value: + '开启 scroll anchoring 特性,即控制滚动位置不随内容变化而抖动,可参考 CSS overflow-anchor 属性。', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/scroll-view.html` }, { @@ -54,7 +332,130 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: `滑块视图容器。\n\n- **注意**:其中只可放置 swiper-item 组件,否则会导致未定义的行为。`, }, - attributes: [], + attributes: [ + { + name: 'indicator-dots', + description: { + kind: 'markdown', + value: '是否显示面板指示点。', + }, + }, + { + name: 'indicator-color', + description: { + kind: 'markdown', + value: '指示点颜色。', + }, + }, + { + name: 'indicator-active-color', + description: { + kind: 'markdown', + value: '当前选中的指示点颜色。', + }, + }, + { + name: 'autoplay', + description: { + kind: 'markdown', + value: '是否自动切换,默认不自动切换。', + }, + }, + { + name: 'current', + description: { + kind: 'markdown', + value: '当前所在滑块的 index,默认0。', + }, + }, + { + name: 'interval', + description: { + kind: 'markdown', + value: '自动切换时间间隔,单位 ms,默认5000。', + }, + }, + { + name: 'duration', + description: { + kind: 'markdown', + value: '滑动动画时长,单位 ms,默认500。', + }, + }, + { + name: 'circular', + description: { + kind: 'markdown', + value: '是否采用衔接滑动,默认不衔接。', + }, + }, + { + name: 'vertical', + description: { + kind: 'markdown', + value: '滑动方向是否为纵向。', + }, + }, + { + name: 'display-multiple-items', + description: { + kind: 'markdown', + value: '同时显示的滑块数量,默认为1。', + }, + }, + { + name: 'previous-margin', + description: { + kind: 'markdown', + value: '前边距,可用于露出前一项的一小部分,接受 px 和 rpx 值。', + }, + }, + { + name: 'next-margin', + description: { + kind: 'markdown', + value: '后边距,可用于露出后一项的一小部分,接受 px 和 rpx 值。', + }, + }, + { + name: 'easing-function', + description: { + kind: 'markdown', + value: '指定 swiper 切换缓动动画类型。', + }, + }, + { + name: 'direction', + description: { + kind: 'markdown', + value: '指定 swiper 切换方向。', + }, + }, + { + name: 'bindchange', + description: { + kind: 'markdown', + value: + 'current 改变时会触发 change 事件,event.detail = {current, source}。', + }, + }, + { + name: 'bindtransition', + description: { + kind: 'markdown', + value: + 'swiper-item 的位置发生改变时会触发 transition 事件,event.detail = {dx: dx, dy: dy}。', + }, + }, + { + name: 'bindanimationfinish', + description: { + kind: 'markdown', + value: + 'swiper-item 动画结束时会触发 animationfinish 事件,event.detail = {current, source}。', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/swiper.html` }, { @@ -69,7 +470,22 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: `滑块视图容器子元素。\n\n- **注意**:仅可放置在 swiper 组件中,宽高自动设置为 100%。`, }, - attributes: [], + attributes: [ + { + name: 'item-id', + description: { + kind: 'markdown', + value: '设置当前 swiper-item 的标识符,必须是唯一的。', + }, + }, + { + name: 'skip-hidden-item-layout', + description: { + kind: 'markdown', + value: '是否跳过隐藏的 swiper-item 布局计算,默认不跳过。', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/swiper-item.html` }, { @@ -84,7 +500,15 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: `[movable-view](${WxCompUrl}/movable-view.html) 的可移动区域。\n\n- **注意**:movable-area 不支持设置 scale-area`, }, - attributes: [], + attributes: [ + { + name: 'scale-area', + description: { + kind: 'markdown', + value: '是否开启缩放区域,默认不开启。', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/movable-area.html` }, { @@ -99,7 +523,133 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: `可移动的视图容器,在页面中可以拖拽滑动。\n\n- **注意**:movable-view 必须在 [movable-area](${WxCompUrl}/movable-area.html) 组件中,并且必须是直接子节点,否则不能移动。`, }, - attributes: [], + attributes: [ + { + name: 'direction', + description: { + kind: 'markdown', + value: + 'movable-view的移动方向,属性值有all、vertical、horizontal、none。', + }, + }, + { + name: 'inertia', + description: { + kind: 'markdown', + value: 'movable-view 是否带有惯性。', + }, + }, + { + name: 'out-of-bounds', + description: { + kind: 'markdown', + value: '超过可移动区域后,movable-view是否还可以移动,默认不允许。', + }, + }, + { + name: 'x', + description: { + kind: 'markdown', + value: + '定义x轴方向的偏移,如果x的值不在可移动范围内,会自动移动到可移动范围;改变x的值会触发动画;单位支持px(默认)、rpx。', + }, + }, + { + name: 'y', + description: { + kind: 'markdown', + value: + '定义y轴方向的偏移,如果y的值不在可移动范围内,会自动移动到可移动范围;改变y的值会触发动画;单位支持px(默认)、rpx。', + }, + }, + { + name: 'damping', + description: { + kind: 'markdown', + value: + '阻尼系数,用于控制x或y改变时的动画和过界回弹的动画,值越大移动越快。', + }, + }, + { + name: 'friction', + description: { + kind: 'markdown', + value: + '摩擦系数,用于控制惯性滑动的动画,值越大摩擦力越大,滑动越快停止;必须大于0,否则会被设置成默认值。', + }, + }, + { + name: 'disabled', + description: { + kind: 'markdown', + value: '是否禁用movable-view,默认不禁用。', + }, + }, + { + name: 'scale', + description: { + kind: 'markdown', + value: '是否支持双指缩放,默认缩放手势生效区域是在movable-view内。', + }, + }, + { + name: 'scale-min', + description: { + kind: 'markdown', + value: '定义缩放倍数最小值。', + }, + }, + { + name: 'scale-max', + description: { + kind: 'markdown', + value: '定义缩放倍数最大值。', + }, + }, + { + name: 'scale-value', + description: { + kind: 'markdown', + value: '定义缩放倍数,取值范围为 0.1 - 10。', + }, + }, + { + name: 'animation', + description: { + kind: 'markdown', + value: '是否使用动画。', + }, + }, + { + name: 'bindchange', + description: { + kind: 'markdown', + value: + '当 movable-view 的位置发生改变时触发,event.detail = {x, y, source}。', + }, + }, + { + name: 'bindscale', + description: { + kind: 'markdown', + value: '缩放过程中触发,event.detail = {scale, x, y}。', + }, + }, + { + name: 'htouchmove', + description: { + kind: 'markdown', + value: '水平方向触摸移动时触发。', + }, + }, + { + name: 'vtouchmove', + description: { + kind: 'markdown', + value: '垂直方向触摸移动时触发。', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/movable-view.html` }, { @@ -115,7 +665,16 @@ const data: html.HTMLDataV1 = { value: '使整个子树从页面中脱离出来,类似于在 CSS 中使用 fixed position 的效果。主要用于制作弹窗、弹出层等。', }, - attributes: [], + attributes: [ + { + name: 'enable', + description: { + kind: 'markdown', + value: + '是否启用传送门功能,启用后组件内容将渲染在应用的最顶层。\n\n- **类型**:`boolean`\n- **默认值**:`false`', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/root-portal.html` }, { @@ -131,7 +690,16 @@ const data: html.HTMLDataV1 = { value: '覆盖在原生组件之上的文本视图。功能同 view 组件。\n\n- **注意**:目前微信原生组件均已支持同层渲染,建议使用 view 替代。(详见微信文档)', }, - attributes: [], + attributes: [ + { + name: 'scroll-top', + description: { + kind: 'markdown', + value: + '设置顶部滚动偏移量,仅在设置了 overflow-y: scroll 成为滚动元素后生效。\n\n- **类型**:`number | string`\n- **说明**:如果设置为字符串,会尝试转换为数字;若转换失败则无效。', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/cover-view.html` }, { @@ -146,7 +714,31 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: '图标组件。', }, - attributes: [], + attributes: [ + { + name: 'type', + description: { + kind: 'markdown', + value: + '图标的类型。可选值包括:\n- success\n- success_no_circle\n- info\n- warn\n- waiting\n- cancel\n- download\n- search\n- clear', + }, + }, + { + name: 'size', + description: { + kind: 'markdown', + value: + '图标的大小。\n\n- **类型**:`number | string`\n- **默认值**:23。', + }, + }, + { + name: 'color', + description: { + kind: 'markdown', + value: '图标的颜色,同 CSS 的 color。', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/icon.html` }, { @@ -161,7 +753,24 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: '文本组件。', }, - attributes: [], + attributes: [ + { + name: 'selectable', + description: { + kind: 'markdown', + value: + '文本是否可选,影响长按复制等功能。\n\n- **类型**:`boolean`\n- **默认值**:`false`\n- **注意**:已废弃。', + }, + }, + { + name: 'user-select', + description: { + kind: 'markdown', + value: + '是否允许用户选中文字。\n\n- **类型**:`boolean`\n- **默认值**:`false`', + }, + }, + ], references: [ { name: WxDocs, url: `${WxCompUrl}/text.html` }, { @@ -176,7 +785,246 @@ const data: html.HTMLDataV1 = { kind: 'markdown', value: '按钮组件。', }, - attributes: [], + attributes: [ + { + name: 'size', + description: { + kind: 'markdown', + value: + '按钮的大小。\n\n- **可选值**:`default`(默认)、`mini`(小尺寸)', + }, + }, + { + name: 'type', + description: { + kind: 'markdown', + value: + '按钮的样式类型。\n\n- **可选值**:`primary`(绿色)、`default`(白色)、`warn`(红色)', + }, + }, + { + name: 'plain', + description: { + kind: 'markdown', + value: + '按钮是否镂空,背景色透明。\n\n- **类型**:`boolean`\n- **默认值**:`false`', + }, + }, + { + name: 'disabled', + description: { + kind: 'markdown', + value: + '是否禁用按钮。\n\n- **类型**:`boolean`\n- **默认值**:`false`', + }, + }, + { + name: 'loading', + description: { + kind: 'markdown', + value: + '名称前是否带 loading 图标。\n\n- **类型**:`boolean`\n- **默认值**:`false`', + }, + }, + { + name: 'form-type', + description: { + kind: 'markdown', + value: + '用于 `