小编Mis*_*pic的帖子

从样式组件推断 Prop 接口

Props我尝试尽可能推断组件的接口而不是导出它们。这不是类和功能组件的问题,但如果我尝试推断Propsa 的接口styled-component,则输入的 propany并不理想。

interface Props {
  bgColor: string;
  children: React.ReactNode;
}

const Box = styled.div<Props>`
  background-color: ${(p) => p.bgColor};
`;

const Button = (props: Props) => (
  <button style={{ backgroundColor: props.bgColor }}>{props.children}</button>
);

type ButtonInferredProps = React.ComponentProps<typeof Button>;

type BoxInferredProps = React.ComponentProps<typeof Box>;

const OtherBox = (props: BoxInferredProps) => (
  <div style={{ backgroundColor: props.bgColor }}>{props.children}</div>
);

const OtherButton = (props: ButtonInferredProps) => (
  <button style={{ backgroundColor: props.bgColor }}>{props.children}</button>
);

export default function App() …
Run Code Online (Sandbox Code Playgroud)

typescript reactjs styled-components

9
推荐指数
2
解决办法
1779
查看次数

如何在html输入文本框中按Enter键的同时防止回发?

我在.aspx页面中使用html输入文本框,当我更改该文本框中的值并按Enter键意味着页面获得回发.除了在"onkeypress"事件中返回false之外,如何防止此回发.

代码:

textBox[0].setAttribute("onkeydown", "return (event.keyCode!=13);");
Run Code Online (Sandbox Code Playgroud)

谢谢,
Karthik.

html javascript asp.net jquery postback

8
推荐指数
1
解决办法
1万
查看次数

异步和线程文化

我有一个MVC应用程序,我覆盖我的基本控制器的OnActionExecuting()方法来设置我的线程文化:

protected override void OnActionExecuting(ActionExecutingContext filterContext) {
    var langCode = GetLangCode();
    Thread.CurrentThread.CurrentUICulture = new CultureInfo(langCode);
    Thread.CurrentThread.CurrentCulture = new CultureInfo(langCode);
}
Run Code Online (Sandbox Code Playgroud)

当我开始异步编程时,如果我们将我们修改过的文化返回到线程池,并且在异步任务完成时调度新线程,我很好奇文化是如何持久化的?我应该知道的任何陷阱?

c# asp.net-mvc async-await

8
推荐指数
1
解决办法
1013
查看次数

Azure中的ExecuteSqlCommand事务

我使用EF 6与Azure Sql数据库.根据Microsoft,不支持用户启动的事务(参考:https://msdn.microsoft.com/en-us/data/dn307226#transactions)

现在,使用EF 6,ExecuteSqlCommand默认情况下包含在事务中:

从EF6 Database.ExecuteSqlCommand()开始,默认情况下会将命令包装在事务中(如果尚未存在).(参考:https://msdn.microsoft.com/en-us/data/dn456843.aspx)

鉴于我的情况,我应该总是抑制这样的ExecuteSqlCommand事务行为:

context.Database.ExecuteSqlCommand(TransactionalBehavior.DoNotEnsureTransaction, @"TRUNCATE TABLE Person;");
Run Code Online (Sandbox Code Playgroud)

c# entity-framework azure azure-sql-database

8
推荐指数
1
解决办法
1273
查看次数

无法使用jQuery读取CORS请求的响应头

我有一个有效的跨域Web服务调用,我将有效负载恢复,但我无法读取响应中的标头.Chrome可以很好地向我显示请求中的标题,但它们在jQuery的成功处理程序中不可用.

var data_obj = { "userName": "myUser", "password": "000000" }

$.ajax({
    type: "POST",
    url: 'https://localhost:8443/AuthService.svc/auth',
    contentType: "application/json; charset=utf-8",
    data: JSON.stringify(data_obj),
    dataType: "json",
    success: function(data, textStatus, jqXHR) {
        console.log(jqXHR.getAllResponseHeaders());
    }
});
Run Code Online (Sandbox Code Playgroud)

记录到控制台的唯一事情是:

Content-Type:application/json; 字符集= utf-8的

以下是Chrome针对OPTIONS和POST响应标头报告的内容,请注意我正在尝试公开FooAuthorization通过Acccess-Control-Expose-Headers:

OPTIONS

Acccess-Control-Expose-Headers:Content-Type, Foo, Authorization
Access-Control-Allow-Headers:Content-Type, Foo, Authorization
Access-Control-Allow-Methods:POST, PUT, DELETE
Access-Control-Allow-Origin:*
Access-Control-Max-Age:1728000
Content-Length:0
Date:Mon, 20 Jul 2015 16:26:00 GMT
Foo:Bar
Run Code Online (Sandbox Code Playgroud)

POST

Acccess-Control-Expose-Headers:Content-Type, Foo, Authorization
Access-Control-Allow-Headers:Content-Type, Foo, Authorization
Access-Control-Allow-Origin:*
Authorization: custom_access_token = some_token
Content-Length:36
Content-Type:application/json; charset=utf-8
Date:Mon, 20 Jul 2015 …
Run Code Online (Sandbox Code Playgroud)

javascript jquery cors

8
推荐指数
1
解决办法
3422
查看次数

重写Azure Web应用程序中的URL

我有一个简单的通配符路由规则我想申请我的Azure网络应用程序.

<rule name="MyRule">
  <match url="*" />
  <action type="Rewrite" url="/index.html" />
</rule>
Run Code Online (Sandbox Code Playgroud)

我有没有任何选择,因为我不能RDP进入机器并摆弄IIS?这不是一个ASP.Net网站,它是一个简单的SPA应用程序.

azure azure-web-sites

8
推荐指数
3
解决办法
2万
查看次数

为什么这些 fetch 方法是异步的?

Fetch 是用于发出网络请求的新的基于 Promise 的 API:

fetch('https://www.everythingisawesome.com/')
  .then(response => console.log('status: ', response.status));
Run Code Online (Sandbox Code Playgroud)

这对我来说很有意义——当我们发起网络调用时,我们会返回一个 Promise,让我们的线程继续处理其他业务。当响应可用时,Promise 中的代码就会执行。

但是,如果我对响应的有效负载感兴趣,我会通过响应的方法而不是属性来这样做:

  • 数组缓冲区()
  • 斑点()
  • 表单数据()
  • json()
  • 文本()

这些方法返回承诺,我不清楚为什么。

fetch('https://www.everythingisawesome.com/') //IO bound
  .then(response => response.json()); //We now have the response, so this operation is CPU bound - isn't it?
  .then(entity => console.log(entity.name));
Run Code Online (Sandbox Code Playgroud)

为什么处理响应的有效负载会返回一个承诺 - 我不清楚为什么它应该是一个异步操作。

javascript fetch

8
推荐指数
1
解决办法
563
查看次数

更好的类型函数来生成媒体查询

我正在关注这篇文章:https : //medium.com/@samuelresua/easy-media-queries-in-styled-components-690b78f50053

我在 Typescript 中创建了以下内容,但不得不求助于any比我必须的更多的输入,我敢肯定:

const breakpoints: ObjectMap<number> = {
  small: 767,
  medium: 992,
  large: 1200,
  extraLarge: 1240
};

export const media = Object.keys(breakpoints).reduce((acc: { [key: string]: (...args: any) => any }, label) => {
  acc[label] = (...args) => css`
     @media (min-width: ${breakpoints[label]}px) {
        ${css(...args as [any])};
     }
  `;
  return acc;
}, {});
Run Code Online (Sandbox Code Playgroud)

因此,当我在媒体查询块中编写样式时,我的 IDE 没有任何帮助:

styled.button<Props>`
  background: red; /* this must be a valid style */
  ${({ theme }) => theme.media.large`
      background: blue;
      foo: bar; …
Run Code Online (Sandbox Code Playgroud)

typescript styled-components

8
推荐指数
2
解决办法
617
查看次数

Excel使用选项卡保存CSV

我有一位同事在XP上使用Excel 2007,每次她将她的工作簿保存为.csv文件时,她都会找到分隔符的标签.知道发生了什么,以及我们如何获得逗号?

excel ms-office

7
推荐指数
1
解决办法
3177
查看次数

使用作用域CSS创建SVG组件

我正在创建将呈现各种SVG的React组件:

const Close = ({
  fill, width, height, float,
}) => (
  <svg width={ `${width}px` } height={ `${height}px` } viewBox="0 0 14.48 14.48" style={ { float: `${float}`, cursor: 'pointer' } }>
    <title>x</title>
    <g id="Layer_2" data-name="Layer 2">
      <g id="Background">
        <line style={ { fill: 'none', stroke: `${fill}`, strokeMiterlimit: 10 } } x1="14.13" y1="0.35" x2="0.35" y2="14.13" />
        <line style={ { fill: 'none', stroke: `${fill}`, strokeMiterlimit: 10 } } x1="14.13" y1="14.13" x2="0.35" y2="0.35" />
      </g>
    </g>
  </svg>
);
Run Code Online (Sandbox Code Playgroud)

能够提供各种属于该组件的尺寸,颜色等,非常方便...

然而,我没有一个好的解决方案是以干燥的方式处理样式.请注意,line元素具有相同的值style.我现在把它们写成内联,因为如果我添加了一个嵌入式样式表,那么我会在页面的其他地方呈现其他SVG的类名冲突(我们的SVG软件反复使用相同的类). …

css svg reactjs

7
推荐指数
1
解决办法
265
查看次数