xuan/TestEShopDist
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

🎈 perf(优化了搜索框与banner图):

Browse Source
This commit is contained in:
cheng
2022-11-22 11:33:42 +08:00
parent 46b80f0700
commit cddb3b93e6
6 changed files with 115 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/banner/index.module.scss
+15 -16
View File
@@ -1,18 +1,17 @@
.swiper_con{
padding:0 20px;
height: 178px;
.xswiper {
height: 100% !important;
.swiper_con {
padding: 0 20px;
height: 270px;
.xswiper {
height: 100% !important;
border-radius: 20px;
.image_item {
width: 100%;
height: 100%;
image {
width: 100%;
height: 100%;
border-radius: 20px;
.image_item{
width: 100%;
height: 100%;
image{
width: 100%;
height: 100%;
border-radius: 20px;
}
}
}
}
}
}
}
src/components/search/index.module.scss
+63 -63
View File
@@ -1,69 +1,69 @@
.search_main{
.search_main {
display: flex;
align-items: center;
position: relative;
width: 100%;
z-index: 0;
.icon_a_sousuo1_self {
font-size: 40px;
color: $color_font_two;
}
.search_con {
position: relative;
display: flex;
align-items: center;
position: relative;
width: 100%;
z-index: 0;
.icon_a_sousuo1_self{
font-size: 37px;
color: $color_font_two;
}
.search_con{
position: relative;
display: flex;
align-items: center;
width: 100%;
input{
font-size: 27px;
background: #eee;
width: 100%;
height: 60px;
border-radius: 50px;
padding: 0 60px;
box-sizing: border-box;
z-index:0;
&::-webkit-input-placeholder { /* WebKit browsers */
color: #999;
font-size: 16px;
}
&::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #999;
font-size: 16px;
}
&::-ms-input-placeholder { /* Internet Explorer 10+ */
color: #999;
font-size: 16px;
}
}
.search_closeBtn{
position: absolute;
right: 10px;
}
}
.btn{
width: 100px;
font-size: $font_size_medium;
color: $color_font_two;
display: flex;
justify-content: center;
align-items: center;
input {
font-size: 27px;
background: #eee;
width: 100%;
height: 72px;
border-radius: 50px;
padding: 0 60px 0 80px;
box-sizing: border-box;
z-index: 0;
&::-webkit-input-placeholder {
/* WebKit browsers */
color: #999;
font-size: 16px;
}
&::-moz-placeholder {
/* Mozilla Firefox 19+ */
color: #999;
font-size: 16px;
}
&::-ms-input-placeholder {
/* Internet Explorer 10+ */
color: #999;
font-size: 16px;
}
}
.icon_inner{
margin-right: 20px;
position: absolute;
left: 10px;
margin-right: 0;
z-index: 10;
.search_closeBtn {
position: absolute;
right: 10px;
}
.icon_out{
margin-right: 10px;
}
.input_out{
padding-left: 20px !important;
}
}
}
.btn {
width: 100px;
font-size: $font_size_medium;
color: $color_font_two;
display: flex;
justify-content: center;
align-items: center;
}
.icon_inner {
margin-right: 20px;
position: absolute;
left: 24px;
margin-right: 0;
z-index: 10;
}
.icon_out {
margin-right: 10px;
}
.input_out {
padding-left: 20px !important;
}
}
src/components/search/index.tsx
+3
View File
@@ -18,6 +18,7 @@ type Params = {
btnTitle?: string
debounceTime?: number //防抖时间，不设默认为零
defaultValue?: string
borderRadius?: string
}
export default memo(
@@ -35,6 +36,7 @@ export default memo(
btnTitle = '搜索', //搜索文字
debounceTime = 0, //防抖时间，不设默认为零
defaultValue = '', //默认值
borderRadius = '50rpx',
}: Params,
ref,
) => {
@@ -85,6 +87,7 @@ export default memo(
)}></View>
)}
<Input
style={{ borderRadius }}
alwaysEmbed={true}
cursorSpacing={150}
placeholderStyle='color:#ABABAB; font-size:26rpx'