uni-search-bar中设置的border项在我的小程序里面border是不生效的，为什么？我的代码：

<template>
<view class="my-search-container">
		<!-- 搜索输入框 -->
		<uni-search-bar v-if="isShowInput" 
        class="my-search-bar"
        :radius="100"
        :bgColor="config.backgroundColor"
        :placeholder="placeholderText"     
        >
			<uni-icons slot="clearIcon" type="clear" color="#999999"/>
		</uni-search-bar>
		<!-- 搜索按钮 -->
		<view class="my-search-box" v-else>
			<!-- 搜索图标 -->
			<image class="icon" src="@/static/images/search.png"></image>
			<!-- placeholder -->
			<text class="placeholder">{{ placeholderText }}</text>
		</view>		
	</view>
</template>
<script>

	export default {
		name:"my-search",
		// properties
		props:{
			//是否显示输入框
			isShowInput:{
				type: Boolean,
				default: false
			},
			//配置对象
			config:{
				type:Object,
				default:()=>({
					height: 36,				
					backgroundColor:'#ffffff',
					icon:'/static/images/search.png',
					textColor: '#454545',	
					border: '1px #c9c9c9 solid'				 
				})
			},
			placeholderText: {
				type: String,
				default: '搜索'
			}
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss" scoped>
.my-search-container {
	display: flex;
	align-items: center;
	.my-search-bar{
		width: 100%;
	}
	.my-search-box {
		height: 36px;
		width: 100%;
		background-color: $uni-bg-color;
		border-radius: 15px;
		border:1px solid $uni-bg-color-border;
		display: flex;
		align-items: center;
		padding: 0 $uni-spacing-row-base;
		.icon {
			width: $uni-img-size-sm;
			height: $uni-img-size-sm;
		}
		.placeholder {
			font-size: $uni-font-size-sm;
			margin-left: $uni-spacing-row-sm;
			color: $uni-text-color-placeholder;
		}
	}
}
</style>

而我的小程序显示的是这样的，没有边框显示出来