请问各位大佬，为啥点击第一个index给空字符串赋值0的时候会失败

<template>
	<view class="contain">
		<scroll-view class="left" scroll-y="true">
			<view :class="primaryClassIndex===index?'left_item_select':'left_item'" v-for="(item,index) in primaryClassArr"
			 @click="handlePrimaryClass(index)" :key="item">
				{{item}}
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				primaryClassArr: ['1', '2', '3', '4', '程序操作'],
	
				primaryClassIndex: ""
			};
		},
		methods: {
			handlePrimaryClass(index) {
				this.primaryClassIndex = index
			}
		}
	}
</script>

第一次进入页面，点击第一个item的时候我打印handlePrimaryClass方法是有执行赋值的，但是页面上primaryClassIndex这个值却没变化，我把primaryClassIndex初始值写为null的时候就不会出现这种问题，是因为空字符串赋值给0有什么问题吗

key绑定的不应该是index吗？