feat: ✨ Search新增customInputClass，placeholderClass等属性 #845
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
总览演练此次更改为 变更
对链接问题的评估
可能相关的 PR
诗歌
Finishing Touches
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
✅ Deploy Preview for wot-design-uni ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify site configuration. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
src/uni_modules/wot-design-uni/components/wd-search/types.ts (1)
14-14: 需要为 customInputClass 属性添加文档注释为了保持代码一致性和可维护性，建议添加与其他属性相同格式的文档注释。
建议添加如下注释：
+ /** + * 输入框自定义样式类 + * 类型: string + * 默认值: '' + */ customInputClass: makeStringProp(''),docs/component/search.md (1)
158-159: 需要更新版本占位符文档中的
$LOWEST_VERSION$占位符需要替换为实际的最低支持版本号。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
docs/component/search.md(2 hunks)src/uni_modules/wot-design-uni/components/wd-search/types.ts(2 hunks)src/uni_modules/wot-design-uni/components/wd-search/wd-search.vue(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (3)
- GitHub Check: Redirect rules - wot-design-uni
- GitHub Check: Header rules - wot-design-uni
- GitHub Check: Pages changed - wot-design-uni
🔇 Additional comments (2)
src/uni_modules/wot-design-uni/components/wd-search/types.ts (1)
93-101: 属性定义和注释看起来不错！placeholderStyle 和 placeholderClass 的属性定义清晰，注释说明充分。
docs/component/search.md (1)
184-184: 外部样式类文档完善新增的 custom-input-class 样式类文档说明清晰。但同样需要更新版本占位符。
| :placeholder-class="`wd-search__placeholder-txt', ${placeholderClass}`" | ||
| :placeholder-style="placeholderStyle" |
There was a problem hiding this comment.
需要修复模板字符串语法并优化类名绑定
当前实现存在以下问题：
- placeholder-class 的模板字符串语法不正确
- 类名绑定可以更简洁
建议按如下方式修改：
- :placeholder-class="`wd-search__placeholder-txt', ${placeholderClass}`"
+ :placeholder-class="['wd-search__placeholder-txt', placeholderClass]"input 元素的其他属性绑定看起来正确。
Also applies to: 18-18
There was a problem hiding this comment.
input placeholder-class ts类型仅支持string，所以无法按照数组传递参数
There was a problem hiding this comment.
@de1ck 感谢指出这个类型限制。我明白了 uni-app input 组件的 placeholder-class 只接受 string 类型。
✏️ Learnings added
Learnt from: de1ck
PR: Moonofweisheng/wot-design-uni#845
File: src/uni_modules/wot-design-uni/components/wd-search/wd-search.vue:14-15
Timestamp: 2025-01-16T07:45:18.744Z
Learning: In uni-app's input component, the placeholder-class attribute only accepts string type in TypeScript, not array. Therefore, class names must be concatenated as strings rather than bound as arrays.
Note: Learnings are effective only in the context of similar code segments. To apply general coding guidelines, please configure review instructions. You can manage existing learnings in the app.
✅ Closes: #299
🤔 这个 PR 的性质是？(至少选择一个)
🔗 相关 Issue
💡 需求背景和解决方案
☑️ 请求合并前的自查清单
Summary by CodeRabbit
新功能
placeholderStyle和placeholderClass属性定制占位符外观弃用
use-suffix-slot属性为已弃用，将在未来版本移除改进