uniapp - cell組件

 

sunui-cell　 用於點擊效果復用(組件僅1kb+iconfont 2kb)

 

v1.0.0 於 2020.01.09更新

v1.0.1 於 2020.01.11更新：新增加右箭頭(iconfont)

 

 

 

 

 

 

參數介紹：

1. hover:是否顯示點擊效果/默認false

2. arrow:是否顯示右箭頭/默認false

3. time:點擊顯示時間/默認170ms

4. cellStyle:組件樣式,可按照行內樣式編寫(無需父組件傳值子組件那樣死板) - 見示例

5. arrowStyle:右箭頭樣式,可按照行內樣式編寫

 

 

示例代碼：

 

 

<template>
	<view class="index-page">
		<view v-for="(item,index) in 10" :key='index'>
			<sunui-cell :hover="true" :arrow="true" arrowStyle="color:blue;font-size:40rpx;" cellStyle="margin-top: 10rpx;border-top:1px solid #eee;border-bottom:1px solid #eee;color:#666;">
				<view style="padding: 12px 15px;">
					點擊hover效果{{index}}點擊hover效果{{index}}
				</view>
			</sunui-cell>
		</view>
	</view>
</template>

<script>
	import sunUiCell from '@/components/sunui-cell/sunui-cell.vue';
	export default {
		data() {
			return {}
		},
		components: {
			'sunui-cell': sunUiCell
		},
		onShow() {

		},
		onLoad() {},
		methods: {}
	}
</script>

<style>

</style>

 

　　

 

　　

點擊下載示例：sunui-cell