木子李

Appearance

微信小程序 ​

小程序去除滚动条 ​

css
::-webkit-scrollbar {
  //去除滚动条
  display: none;
  width: 0;
  height: 0;
  color: transparent;
}

解决微信小程序导航栏背景白色的时候与苹果手机时间，电量颜色重合的问题 ​

json
#pages.json

{
    "pages":[
        {
         "path": "pages/shop/shop",
         "style": {
            "navigationStyle": "custom",
            "disableScroll": true,
            "navigationBarTextStyle": "black",
            "navigationBarBackgroundColor": "#FFFFFF"
            }
	},
    ]
}

或者是在页面中设置

js
	//注意frontColor和backgroundColor是必传项
        onLoad(option) {
             uni.setNavigationBarColor({
                   frontColor: "#000000",
                   backgroundColor: '#ffffff'
             })
	},

去除小程序button按钮灰色边框 ​

css
button::after {
	border: none;
	}

微信小程序引入iconfont ​

css
@font-face {
    font-family: 'iconfont';
    src: url(../serve/iconfont/iconfont.ttf) format('truetype');
	}

引入多个.ttf文件

css
@font-face {
   font-family: 'iconfont';
   src: url(../serve/iconfont/iconfont.ttf) format('truetype');
   }
@font-face {
   font-family: 'iconfont';
   src: url(../serve/iconfont/iconfont_1.ttf) format('truetype');
   }

页面引用

html
<view class="image" :style="{ color: "#3b8dff"}" v-html="&#xe68b"></view>

解决微信小程序表单页input框焦点漂移的问题 ​

vue
<template>
<scroll-view :scroll-y="isScroll" scroll-with-animation="true" style="height: 100vh;"></scroll-view>
</template>
<script>
	export default {
            data(){
                return{
                isScroll:true //当input获取焦点的时候设置false，失去焦点的时候设置为true
                } 
            }
        }
</script>