我使用vue.js写了一个表单，用HTML5的一些属性做简单表单验证

<form>
<div class="club_info">
<h1>战队信息</h1>
<ul>
<li>
<span>学校名称</span>
<input type="text" v-on:keyup="getSchooleName" v-model="school_name" @blur="losefocus" required="required" oninvalid="setCustomValidity('请输入学校名称')"/>
<schoollist :message="school_data" @childEvent="parentMethod"></schoollist>
</li>
<li>
<span>战队名称</span>
<input type="text" required oninvalid="setCustomValidity('请输入战队名称')"/>
</li>
</ul>
</div>
</from>

这个BUG就是，当我在不输入内容的时候，再用submit按钮提交的时候，会提出我没有输入，但是之后输入了后，还是依然会提示我们又输入学校名称

慈悲富美