踩坑记-uniapp+uView（HBuilder）

Posted 2023-04-09

参考技术A Q：方案1：有双搜索图标的原因是，多余的那个灰色搜索图标是移动端解析 input type='search' 时，自带的图标样式。故只需要将input search类型改成常规text类型即可。找到search组件的源码，将 comfirm-type="search" 去掉即可。如下图：

方案2：通过控制编译后的原生dom元素来去掉多余的搜索图标。例如：

uniapp引入uview插件

uview插件是一个很好用的插件，官网：https://www.uviewui.com
引入uview的时候，
1、在插件市场hbuilder直接引入，https://ext.dcloud.net.cn/plugin?id=1593
2、

// main.js，注意要在use方法之后执行
import uView from '@/uni_modules/uview-ui'
Vue.use(uView)
// 如此配置即可
uni.$u.config.unit = 'rpx'

3、

app.vue /*每个页面公共css */
 @import "@/uni_modules/uview-ui/index.scss";
 4、在uni.scss引入 @import '@/uni_modules/uview-ui/theme.scss';
 5、关于SCSS
uView依赖SCSS，您必须要安装此插件，否则无法正常运行。
如果您的项目是由HBuilder X创建的，相信已经安装scss插件，如果没有，请在HX菜单的 工具->插件安装中找到"scss/sass编译"插件进行安装， 如不生效，重启HX即可
如果您的项目是由vue-cli创建的，请通过以下命令安装对sass(scss)的支持，如果已安装，请略过。
// 安装node-sass
npm i node-sass -D

// 安装sass-loader
npm i sass-loader -D