如何在vue.js中使用条件运算符验证字段

<template>
  <div>
    <input v-model="age" type="number" placeholder="请输入年龄" />
    <p v-if="age >= 18">年龄符合要求</p>
    <p v-else>年龄不符合要求</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      age: null
    };
  }
};
</script>

<template>
  <div>
    <input v-model="username" type="text" placeholder="请输入用户名" />
    <input v-model="password" type="password" placeholder="请输入密码" />
    <p v-if="username && password">用户名和密码已填写</p>
    <p v-else>请填写用户名和密码</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      username: '',
      password: ''
    };
  }
};
</script>