el-date-picker type=“year“ 回显问题。并且页面Dom没了（页面输入框没了）

最新推荐文章于 2024-05-31 15:03:39 发布

陶甜也

最新推荐文章于 2024-05-31 15:03:39 发布

阅读量2.3k

点赞数 2

分类专栏：实例文章标签： elementui

本文链接：https://blog.csdn.net/TTianYe/article/details/120883859

版权

实例专栏收录该内容

33 篇文章 1 订阅

订阅专栏

在前端Vue项目中，遇到el-date-picker组件无法显示的问题，原因是后端返回的年份数据类型为number而非预期的string。el-date-picker组件要求值必须为字符串类型，将数值转换为字符串后，问题得到解决。修复代码为：form.year = String(form.year)。

摘要由CSDN通过智能技术生成

问题复现：如图所示
在这里插入图片描述
正常应该是这样的：

 <el-form-item label="年份" size="small">
              <el-date-picker
                v-model="form.year"
                type="year"
                placeholder="选择年份"
                value-format="yyyy"
                clearable 
                editable
                style="width: 100%"
              >
              </el-date-picker>
            </el-form-item>

回显时：
后端返回数据：
form.year=2020；（类型：number）
发现整个dom都没了（页面输入框没了）
后来一直查找html的问题，发现怎么测试都不对，经过测试以后，发现时后端返回的数据问题：
el-date-picker 只接受字符串（string）类型；所以修改：form.year=String(form.year)；
最后得到的数据是：form.year=‘2020’；