EL取数据时(.属性)时取不到相应属性

本文通过一个具体的案例探讨了Java中EL表达式的使用方法及注意事项,重点分析了属性名大小写敏感的问题及其带来的影响。

public class User {
private String name;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}

}

测试表明:

${user.Name}无法取到,报javax.el.PropertyNotFoundException: Property 'Name' not found on type op.User

而${user.name}可以取到。(差别在前面大写N,后面小写n)

其实底层是通过.name转成.getName()获得值,而不是直接获得对象的成员属性。

所以要注意书写规范,若在定义成员变量name是用了大写Name,则容易犯此错误。

<think> 我们正在处理关于表单验证`return true`不到值的问题。根据引用的内容,我们可以从多个角度来考虑解决方案。 首先,引用[4]中提到了ElementUI表单自动验证不到表单值的解决办法。他们使用了`this.$refs[formName].validate`方法,并在验证通过后执行提交操作。如果验证通过(`valid`为`true`),则进行后续操作;如果为`false`,则提示错误。 但是,用户的问题是在表单验证`return true`不到值。这可能意味着在验证函数中,即使返回了`true`,也无法获到表单的值。可能的原因和解决方案如下: 1. **表单数据绑定问题**:在Vue或类似框架中,表单的值通常通过`v-model`绑定到数据对象上。如果数据对象中没有定义相应属性,或者绑定不正确,那么即使验证通过,也无法获值。需要检查表单元素的`v-model`绑定是否正确。 2. **验证机问题**:引用[2]提到,可以控制错误信息显示的机(提交显示错误)。类似地,验证函数可能在用户输入就被触发,但提交可能没有正确获到最新的值。确保在提交重新触发验证或直接使用当前绑定的数据。 3. **异步问题**:引用[4]中使用了`async/await`来处理异步请求。如果在验证函数中有异步操作,需要确保在获值之前异步操作已经完成。但注意,验证函数本身应该是同步的,如果验证函数返回了`true`,但是后续获值的候发现值不对,可能是由于数据更新是异步的(在Vue中,数据更新是异步的,但通常`v-model`会立即更新数据,除非有延迟)。 4. **作用域问题**:在验证函数中,`this`指向可能不是预期的组件实例,导致无法正确获数据。可以使用箭头函数或者在调用绑定正确的`this`。 5. **表单重置问题**:可能在验证通过后,表单被意外重置了,导致值丢失。需要检查是否有重置表单的操作。 6. **引用问题**:使用`this.$refs[formName].validate`方法,确保`formName`正确,且表单引用存在。 根据引用[4]的代码,他们在验证通过后,使用`this.getRuleForm()`来获表单数据(实际上可能是`this.ruleForm`)。因此,建议检查数据对象(如`ruleForm`)中的值是否正确。 解决方案步骤: 1. 确保表单数据正确绑定,例如: ```html <el-form :model="ruleForm" ref="ruleForm"> <el-form-item prop="username"> <el-input v-model="ruleForm.username"></el-input> </el-form-item> </el-form> ``` 2. 在验证函数中,不要直接使用`return true`,而是应该使用框架提供的验证方法,并在回调中获验证结果和值。例如ElementUI的`validate`方法: ```javascript submitForm(formName) { this.$refs[formName].validate((valid) => { if (valid) { // 验证通过,此可以访问this.ruleForm来获表单值 console.log(this.ruleForm); } else { // 验证失败 return false; } }); } ``` 3. 如果验证通过后,`this.ruleForm`中仍然没有值,检查是否在表单输入过程中有修改数据的操作(例如使用了计算属性或自定义的输入处理函数)导致数据没有正确更新。 4. 如果使用了Vue3,引用[5]提到Vue3复杂表单验证的解决方案,注意Vue3的响应式系统,确保数据是响应式的,并且通过`ref`或`reactive`定义。 5. 如果问题依然存在,可以在验证通过后,尝试通过`this.$refs`直接获表单元素的值(不推荐,因为应该通过数据绑定获),或者检查是否有其他代码修改了数据。 因此,针对用户的问题,我们重点检查数据绑定和验证函数中的值获方式。通常,只要数据绑定正确,验证通过后,数据对象中应该包含最新的值。 如果用户是在自定义验证函数中遇到`return true`后不到值,那么需要检查自定义验证函数的实现,确保没有在验证函数中意外修改了数据。 示例:自定义验证函数 ```javascript data() { const checkAge = (rule, value, callback) => { if (value >= 18) { callback(); // 验证通过 } else { callback(new Error('年龄必须大于等于18')); } }; return { rules: { age: [{ validator: checkAge, trigger: 'blur' }] } }; } ``` 在自定义验证函数中,我们通过`callback()`表示验证通过,此表单的值已经更新到绑定的数据对象中。 总结:确保数据绑定正确,验证通过后直接访问绑定的数据对象即可获值。如果仍然不到,检查是否有其他代码干扰。 相关问题: 1. 表单验证通过后如何获表单数据? 2. Vue中如何正确绑定表单数据? 3. 如何在Element UI中处理表单验证? 4. 自定义验证函数中如何获表单值? 5. Vue3中表单验证与Vue2有何不同? 注意:由于引用中包含了多种技术(Laravel、AngularJS、Vue+ElementUI),我们主要针对Vue+ElementUI进行回答,因为引用[3][4][5]都是关于Vue的。 </think>### 表单验证 `return true` 不到值的解决方案 在表单验证中遇到 `return true` 后无法获值的问题,通常由以下原因及解决方案构成: #### 1. **数据绑定问题(最常见)** - **原因**:表单数据未正确绑定到响应式对象 - **解决方案**: ```javascript // Vue3 示例 const formData = reactive({ // 必须使用响应式对象 username: '', password: '' }) ``` 模板中需正确绑定: ```html <el-input v-model="formData.username"></el-input> ``` #### 2. **验证机错误** - **原因**:在异步操作完成前执行了 `return true` - **解决方案**:使用 `async/await` 确保数据就绪 ```javascript submitForm: async function() { const valid = await this.$refs.form.validate() // 等待验证完成 if (valid) { const formValues = { ...this.formData } // 此可获值 } } ``` #### 3. **作用域问题** - **原因**:`this` 指向错误导致访问不到数据 - **解决方案**: ```javascript submitForm() { this.$refs.form.validate(valid => { if (valid) { // 使用箭头函数保留this指向 console.log(this.formData) // 正确访问数据 } }) } ``` #### 4. **表单重置干扰** - **原因**:验证通过后过早重置表单 - **解决方案**:在数据使用后再重置 ```javascript if (valid) { await submitApi(this.formData) // 先提交数据 this.$refs.form.resetFields() // 后重置表单 } ``` #### 5. **Element UI 特定方案** 当使用 Element UI : ```javascript this.$refs.form.validate((valid, fields) => { if (valid) { // 直接获组件内部模型值 const values = this.$refs.form.model } else { console.error(fields) } }) ``` #### 完整示例代码 ```vue <template> <el-form ref="myForm" :model="formData" :rules="rules"> <el-form-item prop="username"> <el-input v-model="formData.username" /> </el-form-item> <el-button @click="handleSubmit">提交</el-button> </el-form> </template> <script> import { reactive } from 'vue'; export default { setup() { const formData = reactive({ username: '' }); const rules = { username: [{ required: true, message: '必填项' }] }; const handleSubmit = async () => { try { const valid = await this.$refs.myForm.validate(); if (valid) { // 确保能获值 console.log('提交数据:', JSON.parse(JSON.stringify(formData))); } } catch (error) { console.error('验证失败', error); } }; return { formData, rules, handleSubmit }; } }; </script> ``` > **关键点**:使用 `JSON.parse(JSON.stringify())` 可解决 Vue 响应式代理导致的值问题[^4][^5]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值