大亨的学习日记-微信小程序（第四天）

大亨x2

于 2021-08-28 15:38:57 发布

阅读量166

点赞数

分类专栏：微信小程序文章标签：小程序微信 css

本文链接：https://blog.youkuaiyun.com/guoyonghengnb/article/details/119968383

版权

微信小程序专栏收录该内容

5 篇文章

订阅专栏

学习目标：

完成首页的设计

总目标：一周做完电商小程序并且写成毕业设计

学习内容：

1、完成了搜索框

引入组件

引入组件三步走
1 创建组件
2 demo/json里声明组件
"usingComponents": { "SearchInput":"../../components/SearchInput/SearchInput" }
3 当做标签引入组件

搜索框组件添加跳转

<navigator class="search_nav" url="../../pages/search/index" open-type="navigate">
搜索
</navigator>

编辑搜索框组件样式

.search_input{
  height: 90rpx;
  padding: 10rpx;
  background-color:var(--themeColor);

}  
.search_nav{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    border-radius: 15rpx;
    color: #666;
  }