Vue antd 初始化页面传值未点击状态下如何获取data

最新推荐文章于 2022-10-24 11:05:40 发布
最新推荐文章于 2022-10-24 11:05:40 发布
阅读量168 收藏
点赞数
分类专栏： Vue antdv
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44564538/article/details/118364779
版权
Vue 同时被 2 个专栏收录
7 篇文章 0 订阅
订阅专栏
antdv
2 篇文章 0 订阅
订阅专栏

左右结构的页面，从项目信息页面点击跳转至详细得分信息，选择左侧的楼号右侧内容相应的改变。但是有个问题。从上及页面到二级页面并没有点击选择左侧的楼栋，右侧的得分信息要怎末默认选择第一个呢？
解决的方法就是在初始化获取data的时候做一个判断看当前状态下有没有点击左侧的楼栋选项有就获取当前楼栋的相应的信息，没有的话，就获取全部的得分信息。具体代码如下
在这里插入图片描述当前id为项目id，根据项目id查询该项目下所有楼号信息
在这里插入图片描述右侧得分项判断
在这里插入图片描述

喵呜来个咪
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue实现设置载入动画和初始化页面动画效果
10-16
今天小编就为大家分享一篇vue实现设置载入动画和初始化页面动画效果，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Ant Design of Vue （3）Card 卡片动态加载后台数据
build2024
09-17 4964
一.首先来建一个vue静态页面 卡片 Card - Ant Design Vue (antdv.com) 来看看页面效果 二.接下修改Card 动态加载显示后台数据 1.这个是后台接口返回数据 2.接口有了，那接下来进行页面改造。 3.接口改造完成，接下来调用接口，加载数据。 获取后台数据的方式很多种，可以用自己拿手的方式进行数据获取，这里只是提供实现的思路，可能不是最挂的方式，各位可以积极指出。 4.数据加载出来了，让它自动刷新显示实时数据 参考...
【Vue-day1】Vue获取Html标签中的值
m0_57450589的博客
03-03 7085
方法1：在自定义函数中加上$event，在js函数中可以获取到点击事件的标签，从而获取对应标签的值，易于分离。 Html代码： <a href="javascript:;" @click="getCity($event)">北京</a> Js代码： getCity:function(event){ console.log(event.target.innerHTML); } 方法2：vue的ref和$refs方法（在Js中test不知道如何分离多...
antd 表单通过form.getFieldsValue获取不全tabs组件下表单数据的问题
程展威的博客
10-24 2632
解决获取tabs下表单不全问题
vue-meta插件的使用
weixin_44432032的博客
02-28 638
1.安装命令 cnpm install vue-meta --save 2.全局文件中引入main.js //引入 import VueMeta from ‘vue-meta’ //实例化 Vue.use(VueMeta); 3.模板文件中 <script> export default { data() { return { header:{ title:'',
最新antd-mobile Form表单使用setFieldsValue初始化表单
weixin_47541876的博客
04-22 2001
你不能用控件的 value 或 defaultValue 等属性来设置表单域的值，默认值可以用 Form 里的 initialValues 来设置。注意 initialValues 不能被 setState 动态更新，你需要用 setFieldsValue 来更新。 主要代码 一、第一种方法，推荐使用 const [form] = Form.useForm() useEffect(()=>{ //defaultBaseInfo你的初始数据 //监听defaultBaseInfo的
vue data恢复初始化数据的实现方法
10-16
总的来说，Vue.js提供了一种简洁的方式，通过`Object.assign()`来恢复`data`到初始化状态，这对于在`<keep-alive>`组件中管理页面状态非常有用。但要注意，这种方法仅适用于不需要深拷贝的情况，若涉及复杂数据结构...
vue项目初始化到登录login页面的示例
10-16
今天小编就为大家分享一篇vue项目初始化到登录login页面的示例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
在vue中实现简单页面逆传值的方法
08-28
在 Vue 中实现简单页面逆传值的方法是一个常见的需求，当我们从一个页面跳转到另一个页面时，原来的页面的 Vue 实例和相关数据已经销毁了，要实现逆传值就要找到操作的对象及它的一些属性。下面是实现简单页面逆传值...
Vue执行方法,方法获取data值,设置data值,方法传值操作
10-14
在这个示例中，我们将详细讨论Vue执行方法、获取和设置data值以及方法间传值的方法。 首先，Vue中的方法通常定义在`methods`对象中，例如`run()`、`getMsg()`和`setMsg()`等。这些方法可以在模板中通过`v-on`或`@`...
antd vue 中使用表格加载动态数据
weixin_43475718的博客
08-12 8363
在api接口文件中写一个get请求方法 export const queryWithBusinessNo = function (params: { businessNo: string }) { return helper.get("/business/queryWithBusinessNo", params); } 然后在写得页面中引入该方法，也可以直接写这个方法 import {...
ant-design-vue UI组件使用讲解
06-10
通过jeecg-boot项目实战，详细介绍 ant-design-vue UI组件使用，细致的讲解每个组件的用法，教你学会如何看ant-design-vue的官方文档。对于初学入门者来讲，非常实用。
vue+antd 父子组件如何传递参数
XIAOYAN_v587的博客
07-15 817
vue+antd 父子组件如何传递参数或者是从当前组件如何向另一个组件传递参数，在这里我们使用props属性。
vue 的点击事件怎么获取当前点击的元素
FantasyWeirdo的博客
03-13 4133
//缩写: @click=&amp;quot;reverseMessage&amp;quot; &amp;amp;lt;div v-on:click=&amp;quot;reverseMessage&amp;quot;&amp;amp;gt; &amp;amp;lt;button&amp;amp;gt;&amp;amp;lt;/button&amp;amp;gt; &amp;amp;lt;/div&a
vue 对象里面有id属性_在Vue中获取自定义属性方法:data-id的实例
weixin_39559750的博客
12-19 1764
获取自定义属性的方法：第一步：首先在标签上绑定上@click="getDateId(item.id)",并将属性值传到绑定的事件里面第二步：在标签上继续绑定：date-id = "item.id"属性第三步：在里面的属性methods里面添写上事件函数 getDateId(id){} 在事件函数里面获取id的值即可methods: {getDataId(id) {console.log(id);}...
antvf2动态数据_AntvF2 踩坑及解决办法总结
weixin_29337315的博客
12-24 989
AntvF2 移动端踩坑及解决办法总结AntvF2 折线图横向滚动 图表空白&乱图> F2版本降到3.5，3.5还不行就继续版本回退同一页面 多个Tab ,切换后图表滑动串图>可能这也不是最优的解决办法，目前只想到了这种解决，可以参考，有更好的办法欢迎留言！// 声明一个全局控制变量let controChart1 = null;//给控制变量赋值controChart1 =...
html页面怎么获取vue里面的data,Vue中避免滥用this去读取data中数据
weixin_31487917的博客
06-09 3938
这篇文章主要介绍了Vue中避免滥用this去读取data中数据的的相关资料，帮助大家更好的理解和学习使用vue框架，感兴趣的朋友可以了解下前言在Vue中，data选项是个好东西，把数据往里一丢，在一个Vue组件中任何一个地方都可以通过this来读取data中数据。但是要避免滥用this去读取data中数据，至于在哪里要避免滥用，如果滥用会导致什么后果，本专栏将会一一揭晓。一、用this读取data...
antd 每次打开modal 初始化数据，mounted方法不执行
sanhuv的博客
10-15 1113
通过添加modal中key解决 链接antd 每次打开modal 初始化数据_无缺的博客-CSDN博客场景：每次打开Modal 重新请求ajax数据，或者初始化Form等数据解决办法：给Modal添加key，每次弹出的时候 改变key的值，保证每次key的值不同 这里使用了Math.random()介绍代码如下：handleOk = () => { this.setState({myKey: Math.random()});}const {visible,myKe...https://blog.cs
动态获取数据点击事件不生效的解决办法
caikys的博客
01-30 4778
html:   &lt;div class="list-click"&gt;点击我&lt;/div&gt; css:     .list-click { cursor: pointer;//IOS失效时给点击的元素添加这个属性 } script:     $(document).on('click',".list-click",function(e){ ...
vue antd radio点击获取所有值
最新发布
05-01
要获取Vue Antd Radio所有选项的值，我们需要使用props来绑定一个数据列表到RadioGroup组件，并在点击事件中使用事件处理函数来获取所选项的值。 首先，在我们的Vue组件中，我们需要定义一个数据列表，用于绑定到...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值