How to change the gender in el-form-item

source code:

<el-form-item label="性别">
         <el-input v-model="loginInfo.sex"></el-input>
 </el-form-item>

Because the sex stored in the database is a number, 1 is male and 2 is female. The front-end call interface also checks out numbers, how to translate it into male and female? I originally wanted to write a translator for translation, but it was in the form of Vue, and I felt that it was too troublesome to use a translator.

So directly use double brackets + ternary operator to solve.

Modified code:

<el-form-item label="性别" prop="loginInfo.sex">
    {
    
    { loginInfo.sex === 1 ? "女" : "男" }}
 </el-form-item>

Remove <el-inpu></el-input> and do it directly in curly braces. Fortunately, there are only 1 and 2 here, and a ternary operator will do.

Finished work, call it a day!