1.完成soup-item组件的布局和样式<template> <view class="soupItem"> <view class="head"> <view class="left"> <soup-tab-group></soup-tab-group> </view> <view class="right"> <uni-icons type="eye" size="18" color="#999"></uni-icons> <text>详情</text> </view>
1.在suop目录下创建list.vue(edit同级)，在分包里面注册路由，并修改self跳转页面到list（代替一切都edit）2.创建 每一条鸡汤 组件soup-item，在components中3.写入list页面内容和样式<view class="soupLayout"> <view class="headTop"> <view class="title">我的鸡汤</view> <view class="btn">+熬制鸡汤</view> </view> <view class="list"> <view class="item" v-for="item in 5"> <soup-item></soup-item> </view> </vie
1.完成edit页面的样式.editLayout{padding: 30rpx; .head{ padding: 20rpx 0; .title{ font-size: 34rpx; padding: 20rpx; padding-bottom: 6rpx; position: relative; &::before{ content: ""; display: block; width: 8rpx; height: 30rpx; background: $brand-theme-color; position: absolute; left: 0; top: calc(50% - 15rpx); border-radius: 10rpx;
1.避免主包过大，在把self的功能选项页面，放在分包里面，建立分包pages_self的页面文件夹2.在pages_self里面创建soup文件夹，里面创建文件页面edit.vue但不创建路由在pages.json里面，也无自己的目录。3.在pages.json里面创立分包（主包同级创建），并写好分包里面的页面路由"subPackages": [ { "root": "pages_self", "pages": [ { "path": "soup/edit", //注意写好分包页面路径路由 "style": { "navigationBarTitleText": "编辑"
1.导入外部图标到static/fonts里面，只需要iconfont.css和iconfont.ttf2.再在app.vue中引入这个css文件@import "@/static/fonts/iconfont.css";3.然后使用拓展图标，替换self.vue中的以前的图标（使用custom-prefix） //使用的iconfont里面的图标<uni-icons custom-prefix="iconfont" type="xxm-experiment-fill" size="18" color="#fff"></uni-icons> 然后依次给不同type的进行替换4.给每个项的图标加入不同的颜色<view class="icon" style="background-image: linear-gradient(to right,#55f809,#B4F8C8);"> //向右渐变，从一个颜色到另一个颜色
ikrins
