Vue input box automatically refreshes the page after pressing Enter

A bug was found in today’s test. When entering the barCode in the input box, pressing the Enter key should enter the quantity, but the page is refreshed directly. Let’s explore why?

Reason: The W3C standard stipulates that when there is only one input box in a form element, pressing Enter in the input box should submit the form. 

solution: 

Can add @submit.native.prevent on tags.

<el-form label-position="top" size="mini" :inline="true" :disabled="disabledByExtract" @submit.native.prevent>

 <el-input v-model="scanInput.scanResult.value" :text.sync="scanInput.scanResult.text" 
 :disabled="!item.organizationId || disabledByExtract" 
 @change="handleProductSkuScanChange"> 
 </el-input>

</el-form>

Guess you like

Origin blog.csdn.net/weixin_56650035/article/details/124194346