Question

我正在创建一个反应表（新反应），但是CategoryData没有正确创建单元格，即它创建的单元格与来自父级的string authority = ConfigurationManager.AppSettings["authority"]; string clientID = ConfigurationManager.AppSettings["clientID"]; Uri clientAppUri = new Uri(ConfigurationManager.AppSettings["clientAppUri"]); string serverName = ConfigurationManager.AppSettings["serverName"]; var code = Request.Params["code"]; AuthenticationContext ac = new AuthenticationContext(authority, true); ClientCredential clcred = new ClientCredential(clientid, secretkey); //ac = ac.AcquireToken(serverName, clientID, clientAppUri, PromptBehavior.Auto); //string to = ac.AcquireToken(serverName, clientID, clientAppUri, PromptBehavior.Auto).AccessToken; var token = ac.AcquireTokenByAuthorizationCodeAsync(code, new Uri("http://localhost:2694/GetAuthCode/Index/"), clcred, resource: "https://graph.microsoft.com/"); string newtoken = token.Result.AccessToken; ExchangeService exchangeService = new ExchangeService(ExchangeVersion.Exchange2013); exchangeService.Url = new Uri("https://outlook.office365.com/" + "ews/exchange.asmx"); exchangeService.TraceEnabled = true; exchangeService.TraceFlags = TraceFlags.All; exchangeService.Credentials = new OAuthCredentials(token.Result.AccessToken); exchangeService.FindFolders(WellKnownFolderName.Root, new FolderView(10)); Appointment app = new Appointment(exchangeService); app.Subject = ""; app.Body = ""; app.Location = ""; app.Start = DateTime.Now; app.End = DateTime.Now.AddDays(1); app.Save(SendInvitationsMode.SendToAllAndSaveCopy);不对齐，而不是有细胞边界。它也发出了这些警告：

<th>

我不确定为什么会出现这种警告以及为什么表格单元格（来自Warning: validateDOMNesting(...): <div> cannot appear as a child of <tbody>. See Param > tbody > Row > div. Warning: validateDOMNesting(...): <tr> cannot appear as a child of <div>. See Row > div > tr. Warning: validateDOMNesting(...): <tr> cannot appear as a child of <div>. See CategoryData > div > tr.）没有对齐且没有单元格边框。什么是正确方式？

代码

CategoryData

Answer 1

我会改变第三个＆＃39;到了＆＃39; tr＆＃39;因为我非常确定如果你添加“反应”，反应会给你一个警告。在＆＃39; tbody＆＃39;

import codecs
files=glob.glob('C:/example/*.csv') 
fileObj = codecs.open( files, "r", "utf-8" )

警告的话我会避免使用表格checkout css网格，它们更加灵活且得到很好的支持

Answer 2

编辑：从版本16.0.0 开始，你可以利用React.Fragment从渲染中返回多个元素

PopupWindowCompat.showAsDropdown(...)

在v16之前

在<tbody> { this.state.categories.map((category, index) => { var innerData = this.state.data.map((row, i) => { if (row.category === category) { return ( <tr key={i}> <td className="col-lg-2 text-center">{row.name}</td> <td className="col-lg-2 text-center">{row.alias}</td> <td className="col-lg-2 text-center">{row.description}</td> <td className="col-lg-1 text-center">{row.default_value}</td> <td className="col-lg-1 text-center">{row.min_value}</td> <td className="col-lg-1 text-center">{row.max_value}</td> <td className="col-lg-1 text-center">Action</td> </tr> ) } return null }) return ( <React.Fragment> <th colSpan="7" key={index} style={{ 'textAlign': 'left', 'paddingLeft': '5px', 'backgroundColor': '#D3D0CF' }}>{this.state.category}</th>, {innerData} </React.Fragment> ) }) } </tbody>的帮助下，可以从组件中返回多个元素，方法是将它们写成数组中的逗号分隔元素，如

JSX syntactic sugar

此外，当您在map函数中使用if语句时，您需要将它们放在return语句之外，现在如果您执行<tbody> { this.state.categories.map((category, index) => { var innerData = this.state.data.map((row, i) => { if (row.category === category) { return ( <tr key={i}> <td className="col-lg-2 text-center">{row.name}</td> <td className="col-lg-2 text-center">{row.alias}</td> <td className="col-lg-2 text-center">{row.description}</td> <td className="col-lg-1 text-center">{row.default_value}</td> <td className="col-lg-1 text-center">{row.min_value}</td> <td className="col-lg-1 text-center">{row.max_value}</td> <td className="col-lg-1 text-center">Action</td> </tr> ) } return null }) return ([ <th colSpan="7" key={index} style={{ 'textAlign': 'left', 'paddingLeft': '5px', 'backgroundColor': '#D3D0CF' }}>{this.state.category}</th>, [...innerData] ]) }) } </tbody>，则意味着箭头之后的任何内容都被认为是返回，因此你的内部地图if语句会给你一个错误。

在反应github页面上有一个 issue ，用于返回多个元素。仔细阅读它了解更多详情。

警告：validateDOMNesting（...）：<div>不能显示为子节点

2 个答案: