ant中modal组件无法获取到this

最新推荐文章于 2024-03-14 15:22:12 发布

想快快长大

最新推荐文章于 2024-03-14 15:22:12 发布

阅读量790

点赞数

分类专栏： React Ant

本文链接：https://blog.csdn.net/qq_41812254/article/details/104156811

版权

React 同时被 2 个专栏收录

7 篇文章 0 订阅

订阅专栏

Ant

4 篇文章 0 订阅

订阅专栏

因为里面onOk方法是普通函数

我们把他弄成箭头函数即可

onOk: () => {
        deletrArticle(record.id).then(() => {
          message.success("删除文章成功!");
          this.getData();
        });
      }

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

想快快长大

关注关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

antd modal 拖动_Package - antd-draggable-modal

weixin_33764463的博客

01-17

828

基于Ant-design的可以拖拽的Modal基于Ant-design的可以拖拽的Modal 特性：支持弹出窗居中打开支持拖拽 title bar 实现拖拽支持多层弹窗拖拽安装:$ yarn add antd-draggable-modal用法:import React, { Component } from 'react';import { Button } from 'antd';import...

Ant中Modal组件实现可拖动/拖拽功能

weixin_54754781的博客

07-01

1387

Ant Design组件库中的Modal组件实现可拖动/拖拽功能封装的组件

参与评论您还未登录，请先登录后发表或查看评论

Ant Design Modal 中嵌入Form表单后，initValue，不能动态获取最新值得问题

Meditate_MasterYi的博客

01-06

1万+

场景描述：如下图所示，当我点击某个盒子的时候，我需要得到该盒子的数据，问题：当我第一次点击的时候得到了当前的数据值，但是在点击其他的盒子的时候数据form中的数据还是上次的数据，并未更新。刷新页面后出现当前盒子的数据信息，然后再次失效 Modal {...modalOpts} maskClosable={false}> Form layout="horizontal"

AlertDialog 获取上下文的问题

八戒卖萌的博客

07-28

4391

Log Error android.view.WindowManager$BadTokenException: Unable to add window -- token null is not for an app 今天给删除收货地址写AlertDialog的时候，无论怎么样都是不能Create ，我是把AlertDialog 写在Adapter里面了而且上下文mCo

使用Antd的modal确认框，点击【确定】，调用onOk方法时，检查是否有错误，有错误会隐藏当前页面的问题

热门推荐

u013282737的博客

10-21

1万+

希望点击【确定】时，效果如1: 1: 实际效果确实：警告内容显示后，确认框消失了如下，调用onOk的时候，加一个e,就解决问题了，效果就如1： ...

Ant Design Vue 使用this.$confirm注意事项

Auguest_K的博客

01-05

5770

this.$confirm({ title: '重要提示：',//标题 class:'nextMonth',//类名 icon:'',//可以更换页面展示图标 centered:true,//页面居中位置 content: '请确认您 XXXX ！', onOk:()=> { //点击确认时的执行 } }); 页面展示想...

ant design Form 组件总结结合Modal 自定义Modal的实现（Upload Input Select DatePicker Cascader）

cuandeqin2083的博客

04-28

2964

起源最近在项目中发现要写多个弹框（用于查看、编辑、新建XX信息），如下图。像这样花里胡哨的弹框在一个大型的中台管理系统中，可能要写上好几遍的Modal 但是其实他们大同小异。首先，他们的title是固定的（增、改、查）底下的内容也是固定的，无非就是Upload Input Select DatePicker Cascader （写不了<>。其实应该是ant design 的组...

实现ant-desgin里的Modal组件拖拽

qq_45785424的博客

07-13

866

在使用Modal组件时,新增了一个需求,让他能够实现拖拽的效果 1.首先找到控制modal的类名让这个div框变为一个绝对定位,它默认是相对定位,然后可以给它一个高度,如果不给,就是我图中的样子了.在index.less文件里面给它样式,引入 index.less .ant-modal-content{ position: absolute !important; width: 480px; } 2.封装一个drag.js drag.js class DragBox { construct

ant design——Modal

JIN-BOSS的博客

04-23

3137

用ant design中的Modal有一段时间了，就我使用的一些API进行简单总结blablablabla… Modal关闭时卸载组件 <Modal title={null} //模态框的标题 className={this.state.modalClass} //采用自定义类名，这样重写模态框样式的时候不至于影响其他模态框样式 visible={this.state...

Ant Design Vue Modal 对话框 this.$warning is not a function

qwe122343的博客

03-24

2999

Modal 对话框十分常用，但用官网这个信息提示模板竟然报错了 warning() { this.$warning({ title: 'This is a warning message', content: 'some messages...some messages...', }); }, 简单粗暴的结论： this.$warning应该改成Modal.warning 改后： warning() { Modal.warning({ title: 'This

antd modal的onOk提交form表单

feifeichongtian的博客

08-17

4788

import React, { Component } from 'react' import { Modal, Form, Input, Button } from 'antd' import FormModal from './SharedForm' class SharedFormModal extends Component { state = { visible: true, } showModelHandler = (e) => { if (e) e.s.

【antdv中this.$confirm 里面拿不到this】

qq_43506529的博客

07-25

1648

Ant Design Vue 中使用 this.$confirm 时，this调用data数据和方法都失败，提示是该方法未定义。问题: 确认框点击确认后需要执行一些方法，发现报错

原生JS封装Modal弹框

qq_32021429的博客

04-12

2681

使用原生JS(es5)封装一个属于自己的Modal弹框效果图展示主要代码 function Modal(options) { options = Object.assign({ title: '标题', backgroundColor: '#fff', // 背景颜色 mask: true, //是否显示遮罩层, content: '弹框内容', cancelText: '取消',//取消按钮文字 okText: '确认'

react中点击按钮不能获取最新的state时候

最新发布

m0_51578916的博客

03-14

537

【React】在方法内调用另一个方法报错undefined

Owen的博客

05-14

702

错误写法： onOk={ request("~", { method: "POST", }).then((res) => { if (res.status) { message.success("成功"); this.handleSearchList() //报错 } else { message.war

AntdesignVue 局部全屏后Message、Select 、Modal、Date等组件不显示问题解决方案（最终版）

朝花夕拾的博客

04-25

4650

1、对this.$message.....这种的消息提示组件解决方案如下1、对this.$message.....这种的消息提示组件解决方案如下在main.js中全局配置消息提示测试可以在父组件DIV全屏后可以弹出提示。

vue中this失效问题

qq_44716001的博客

05-31

1259

点击confirm按钮后，执行function方法中，如果在方法内容要使用data中定义的一个变量，使用this.ids时，发现此时的this是undefined，无法直接进行引用，原因是因为。箭头函数出现在es6，箭头函数里面没有this对象，此时的this对象指的是是外层的 this 对象，所以入如果在函数中要引用外面的this对象，推荐使用箭头函数。this.$modal.confirm('是否确认删除编号为"' + _that.ids + '"的数据项？

关于OnOK()、OnCancel()、OnClose()、OnDestroy() 模式对话框

weixin_30735391的博客

11-16

688

总结OnOK()、OnCancel()、OnClose()、OnDestroy()之间的区别(转) 2009年09月22日下午 08:33 第一，OnOK()和OnCancel()是CDialog基类的成员函数，而OnClose()和OnDestroy()是CWnd基类的成员函数，即WM消息响应函数。从应用程序结构的角度，拿对话框来说，红色的X对应的是CWnd,而处于对话框中的“确定”、“取...

antdesign vue中的modal组件的getContainer属性怎么使用

05-26

Ant Design Vue 中的 Modal 组件的 `getContainer` 属性用于指定 Modal 渲染的容器元素。具体使用方法如下： 1. 在需要使用 Modal 的组件中，引入 Modal 组件，并在 `template` 中定义 Modal 的内容： ``` <template> <div> <a-button type="primary" @click="showModal"> 显示 Modal </a-button> <a-modal :visible="visible" @cancel="hideModal" :getContainer="getContainer"> <p>这是 Modal 的内容</p> </a-modal> </div> </template> ``` 2. 在 `methods` 中定义 `getContainer` 方法，用于返回 Modal 渲染的容器元素： ``` <script> export default { data() { return { visible: false } }, methods: { showModal() { this.visible = true; }, hideModal() { this.visible = false; }, getContainer() { return document.body; // 返回 Modal 渲染的容器元素，这里指定为 body 元素 } } } </script> ``` 在以上示例中，我们将 Modal 的容器元素指定为 `body` 元素，这意味着 Modal 将会在页面的最顶层渲染。如果你希望 Modal 渲染在其他元素内部，可以返回其他元素的引用。需要注意的是，由于 Modal 是通过 `createPortal` API 渲染到指定的容器中的，因此需要确保容器元素存在于文档中。如果容器元素不存在，将会导致报错。