小编Kor*_*sik的帖子

我对这个小的JavaScript代码有些麻烦:

var text="Z Test Yeah ! Z";

// With literal syntax, it returns true: good!
alert(/(Z[\s\S]*?Z)/g.test(text));

// But not with the RegExp object O_o
var reg=new RegExp('Z[\s\S]*?Z','g');
alert(reg.test(text));

我不明白为什么文字语法和RegExp对象没有给我相同的结果...问题是我必须使用RegExp对象,因为我稍后会有一些变量.

有任何想法吗？

提前致谢 :)

我是SVG世界的新手,当我想"画"弯曲箭头时,我遇到了一些问题.

基本上,我想创建一个类似于本文中解释的动画,但在路径的末尾有一个形状,以显示箭头.

以下是我用于直箭的代码:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
<defs>
  <marker
    id="arrow"
    orient="auto"
    viewBox="0 0 10 10"
    markerWidth="3"
    markerHeight="4"
    markerUnits="strokeWidth"
    refX="1" refY="5">
   <polyline points="0,0 10,5 0,10 1,5" fill="black" />
  </marker>
</defs>

<path
    id="line"
    marker-end="url(#arrow)"
    stroke-width="3"
    fill="none"
    stroke="black">

    <animate
        dur="2s"
        repeatCount="indefinite"
        attributeName="d"
        values="M10,10 L10,10; M10,10 L45,25;" />
</path>

有点CSS:

#line
{
   stroke-dasharray: 5;
  stroke-dashoffset: 10;
  -webkit-animation: draw 1s linear infinite;
}

@-webkit-keyframes draw
{
  to { stroke-dashoffset: 0;}
}

结果如下:

所以这很酷,但现在我想要一个弯曲的箭头.所以我更新了如下的animate标签:

<animate
        dur="2s"
        repeatCount="indefinite"
        attributeName="d"
        values="M7,121 C7,121 7,121 7,121; …

我目前正在使用WebSockets和PHP服务器:它适用于谷歌Chrome和Opera,但不适用于Firefox 6.

我认为这是由于最后一次使用的协议版本:我看到它使用的是第七版,而对于Google Chrome和Opera来说它是较旧版本.

因此,我修改了我的服务器代码以管理这个新版本:通过使用258EAFA5-E914-47DA-95CA-C5AB0DC85B11和其他东西散列安全密钥,Firefox成功连接.但是如果另一个客户想要连接(甚至是另一个Firefox),那么第一个用Firefox连接自己.

我看到socket_recv()收到的缓冲区为空或散列...

所以我决定跳过管理Firefox 6使用的协议的想法(互联网上没有文档......!):我认为指定直接在JavaScript中使用的协议可能更容易.

在这个页面上,他们说我们可以这样写:

var mySocket = new WebSocket("http://www.example.com/socketserver", "my-custom-protocol");

但是为了使用Google Chrome和Opera管理的协议,我们应该编写什么而不是"my-custom-protocol"？

提前致谢!

我是TypeScript(1.8)的新手,我对继承和静态属性有一个小问题.

请在下面找到我正在运行的测试代码:

class A {
    public static Items = {
        FOO: 'A'
    };

    public show() {
        alert(this.constructor.Items.FOO);
    }
} 

class B extends A {
    public static Items = {
        FOO: 'B'
    };
}

var a = new A();
var b = new B();

a.show(); // alert "A"
b.show(); // alert "B"

TypeScript Playground链接

此代码运行正常,两个警报按预期显示.

但是 TypeScript编译器会抛出错误:Property "Items" does not exist on type "Function"

我理解这个警告,从TypeScript的角度来看它是完全正确的,但是如何在编译器满意的同时实现相同的结果呢？ this.Items.FOO显然不起作用,我没有找到self相应或类似的东西......

我错过了什么吗？

提前致谢!

我正在开发一个包含大量代码的旧项目。这个项目使用 Webpack 3.8.1，我正在尝试更新到 4.4.1，这真是一个障碍！

主要的痛苦是项目使用 CommonsChunkPlugin：

new CommonsChunkPlugin({\n    name: \'common\',\n    minChunks: 3,\n    chunks: _.without(_.keys(entry), \'ace-iframe\', \'custom-theme-ace\'),\n}),\n\nnew CommonsChunkPlugin({\n    name: \'vendors\',\n    minChunks(module, count) {\n        return isVendorModule(module) && count >= 2;\n    },\n    chunks: _.without(_.keys(entry), \'ace-iframe\', \'custom-theme-ace\'),\n})\n

我知道Webpack 4不再提供CommonsChunkPlugin。非常感谢以下文章，它们节省了研究时间：

\n
• https://gist.github.com/sokra/1522d586b8e5c0f5072d7565c2bee693
\n
• https://medium.com/webpack/webpack-4-code-splitting-chunk-graph-and-the-splitchunks-optimization-be739a861366
\n

感谢这些令人惊叹的链接，我用以下几行替换了 CommonsChunkPlugin：

optimization: {\n    splitChunks: {\n        cacheGroups: {\n            vendors: {\n                priority: 50,\n                    name: \'vendors\',\n                    chunks: \'async\',\n                    reuseExistingChunk: true,\n                    minChunks: 2,\n                    enforce: true,\n                    test: /node_modules/,\n                },\n\n                common: {\n                    name: \'common\',\n                    priority: 10,\n                    chunks: \'async\',\n                    reuseExistingChunk: …

与世界上的应用程序一样，我的 React 应用程序需要对 API 执行一些 Ajax 调用。

我选择使用 Redux 中间件，以便正确地将 API 获取与我的组件分开。
这个想法是从我的组件中分派REQUEST操作。中间件监听它们并调度SUCCESS或ERROR操作：最后这些由减速器监听。

这里很多人已经问过如何从 Redux 中间件分派操作：这不是我的问题的主题:)

首先，让我向您展示我用来编写的一个简单的减速器：

function currentUserReduxer(state = {}, action = {}) {
  const { currentUser, error } = action.payload;

  switch (action.type) {
    case 'GET_CURRENT_USER_REQUEST':
      return { ...state, isFetching: true, error: null };

    case 'GET_CURRENT_USER_SUCCESS':
      return { ...state, id: currentUser.id, isFetching: false };

    case 'GET_CURRENT_USER_FAILURE':
      return { ...state, isFetching: false, error };

    default:
      return state;
  }
}

以及相应的中间件：

() => …

我正在尝试将 Material-UI ( https://material-ui.com/ ) 与 NextJS ( https://nextjs.org/ ) 一起使用，并使用 JSS 解决方案进行样式设置。

它在我的本地环境中运行良好，但我的设计在 prod 上被破坏了。经过快速分析，这似乎是标签的注入顺序的问题<style>：我的样式确实在 MUI 之间注入，取消了我的更改。

开发环境

产品环境

从上面的截图可以看出，产品中的注入顺序是不同的。因此，该Alert样式会因MuiButton使我的页面损坏而被覆盖。 （我也不明白为什么 和Alert的DashboardLayout样式有一个空克隆，但这不是我的主要问题......）

值得注意的是，在服务器端生成的样式是可以的：页面在加载时正确呈现。仅在客户端运行后才会出现此问题。

我的代码基于Material-UI 的这个示例（与 NextJS 一起使用）。

我真的不明白为什么它在开发上没问题，但在产品上却不行（而且我无法使用 NextJS 在本地运行产品构建以方便调试^^'）。

您知道如何理解和调查这个问题吗？

提前致谢 ：）