feat: 商品搜索列表添加搜索关键词高亮效果

src/pages/lxMall/commodity/list.less

@@ -115,11 +115,13 @@
 
           .price_info_wrap {
             margin-bottom: 6px;
-            & > span {
+
+            &>span {
               font-size: 18px;
               color: #D32F2F;
               font-weight: bold;
             }
+
             .price_info_unit {
               font-size: 12px;
               color: #909399;
@@ -328,3 +330,12 @@
   }
 
 }
+
+
+:global {
+  .highlight {
+    color: #D32F2F;
+    font-weight: 500;
+    font-size: 13px;
+  }
+}

src/pages/lxMall/commodity/list.tsx

@@ -75,7 +75,7 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
                     {
                       renderPrice(item)
                     }
-                    <div className={styles.goods_name}>{item.name}</div>
+                    <div className={styles.goods_name} dangerouslySetInnerHTML={{ __html: item.name }} />
                     <div className={styles.count}>成交{numFormat(item.sold) || 0}{item.unitName}</div>
                     <div className={styles.company_info}>
                       <img className={styles.credit_icon} src={shopDefaultIcon} />
@@ -104,7 +104,7 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
                   <div className={styles.commodity_info}>
                     <div className={styles.commodity_info_name}>
                       <a href={getCommodityDetailLink(item)}  target="_blank" rel="noreferrer">
-                        {item.name}
+                        <div dangerouslySetInnerHTML={{ __html: item.name }} />
                       </a>
                     </div>
                     <div className={styles.commodity_info_slogan}>{item.slogan}</div>
@@ -121,7 +121,6 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
                       <img className={styles.credit_icon} src={shopDefaultIcon} />
                       <div className={styles.shop_name}>{item.memberName}</div>
                     </div>
-                    {/* <Rate className={styles.star} count={5} disabled defaultValue={5} /> */}
                     <div className={styles.credit}>
                       <img className={styles.credit_icon} src={creditIcon} />
                       <span>{item.creditScore || 0}</span>
@@ -150,36 +149,6 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
                       查看详情
                     </a>
                   </div>
-
-                  {/* <div className={styles.info_box_content}>
-                    <div className={styles.name}>{item.name}</div>
-                    <div className={styles.price}>
-                      {
-                        item.priceType === 1 ? (
-                          <>
-                            <span>￥</span>{priceFormat(item.min)}
-                          </>
-                        ) : (
-                            <div className={styles.inquiry_price}>
-                              <label>在线询价</label>
-                            </div>
-                          )
-                      }
-                    </div>
-                    <div className={styles.count}>已售: {numFormat(item.sold) || 0} {item.unitName}</div>
-                  </div>
-                  <ul className={styles.tags_list}>
-                    {
-                      item.sellingPoint && item.sellingPoint.map((pointItem, pointIndex) => (
-                        <li className={styles.tags_list_item} key={`tags_list_item_${pointIndex}`}>{pointItem}</li>
-                      ))
-                    }
-                  </ul>
-                  <div className={styles.credit}>
-                    <img className={styles.credit_icon} src={creditIcon} />
-                    <span>{item.creditScore || 0}</span>
-                  </div>
-                  <div className={styles.shopname}>{item.memberName}</div> */}
                 </div>
               </div>
 

src/pages/lxMall/components/Filter/index.tsx

@@ -4,7 +4,6 @@ import { inject, observer } from 'mobx-react'
 import CommonlyUsed from './components/CommonlyUsed'
 import Category from './components/Category'
 import { FILTER_TYPE } from '@/constants'
-import Style from './components/Style'
 import Brand from './components/Brand'
 import Price from './components/Price'
 import UseArea from './components/UseArea'