小编Ami*_*mir的帖子

Summernote是一个jQuery插件,我不需要它的类型定义.我只想修改对象,但TS不断抛出错误.下面的一行仍然告诉我:"'jQueryStatic'类型中不存在"属性'summernote'." 错误.

(function ($) {

  /* tslint:disable */
  delete $.summernote.options.keyMap.pc.TAB;
  delete $.summernote.options.keyMap.mac.TAB;
  /* tslint:enable */

})(jQuery)

编辑:

这是我的tsconfig.json

{
  "compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "noImplicitAny": true,
    "module": "commonjs",
    "target": "es5",
    "allowJs": true,
    "noUnusedParameters": true
  },
  "include": [
      "js/**/*"
  ],
  "exclude": [
      "node_modules",
      "**/*.spec.ts"
  ]
}

我不确定我应该在反应类组件中标记我的方法.我在这些方法上收到此错误:componentDidMount,componentDidUpdate,componentWillUpdate和render

这是我的基本组件:

import * as React from 'react';

const { Component } = React;

export default class Loading extends Component<{}, {}>  {
  componentDidMount() {
    console.log('....something....');
  }
  componentDidUpdate() {
    console.log('....something....');
  }
  componentWillUpdate() {
    console.log('....something....');
  }

  render() {
    const style = {
      background: '#f5f5f5',
      height: '100%',
      padding: '20px',
      textAlign: 'center',
      transition: 'all 0.5s linear',
      width: '100%'
    };
    return (
      <div id='app-loader' className='rounded' style={style}>
        <div className='loader large block rounded'>Loading...</div>
      </div>
    );
  }
}

我不能把私有render()等因为破坏组件.

异步函数中的我的await语句是对jQuery的$ .post()方法的调用,该方法返回一个有效的promise,但是我在TypeScript中遇到了这个错误:

'await'操作数的类型必须是有效的promise或者不能包含可调用的'then'成员.

我的功能是这个(示例简化).代码有效且有效,但我在TS控制台中收到错误.

 async function doAsyncPost() {
    const postUrl = 'some/url/';
    const postData = {name: 'foo', value: 'bar'};
    let postResult;
    let upateResult;

    function failed(message: string, body?: string) {
      console.log('error: ', message, ' body: ', body);
    }

    function promiseFunc() {
      return new Promise<void>( resolve => {
        // ... do something else....
        resolve();
      });
    };

    function finish() {
      // ... do something at the end...
    }

    try {
      // The error is on the $.post()
      postResult = await $.post(postUrl, $.param(postData));
      if …

我一直在构建一个大型单页面应用程序,最近开始探索JS中的内存泄漏.而且我认为我有内存泄漏因为 - 因为我在Chrome中使用Profiles(快照)功能 - 我看到我有很多独立的DOM元素.

这是我的设置的简化视图:

<div id="container">
  <div class="buttons">
    <a class=".btn" href="/someurl/"> Button A</a>
    <a class=".btn" href="/someurl/"> Button B</a>
    <a class=".btn" href="/someurl/"> Button C</a>
  </div>

  <div class="ajaxHolder"></div>
</div>

因此,如果用户单击按钮A,我会使用AJAX调用将内容加载到.ajaxHolder.像这样的东西:

//This is the content...
<div class="contentA">
  <p>some text...</p>
  <input type="checkbox" class="checkbox">
  <input type="checkbox" class="checkbox">
  <input type="checkbox" class="checkbox">
  <input type="checkbox" class="checkbox">
</div>

我的MAIN脚本文件中也有两个函数.一个是这样的:

//Click event bound to a.btn which tigger the ajax call
$(.buttons).on('click', '.btn', function(){ 
  //Do ajax here...
  //on success...
  var holder = $(".ajaxHolder");
  holder.children().off().remove(); // …

我的用户交互过程如下:

1. 向用户显示包含城市列表的下拉列表
2. 选择城市后,AJAX请求会获取城市中的所有建筑物,并将它们插入到div中(此AJAX请求会返回一个复选框列表)
3. 然后,用户可以选中/取消选中一个复选框,将城市添加到同一页面上的表格中.(这会动态插入/删除表行)

这是我的选择下拉列表:

<label for="city-selector">Choose your favorite city?</label>
  <select name="select" size="1" id="city-selector" aria-controls="city-info">
  <option value="1">Amsterdam</option>
  <option value="2">Buenos Aires</option>
  <option value="3">Delhi</option>
  <option value="4">Hong Kong</option>
  <option value="5">London</option>
  <option value="6">Los Angeles</option>
  <option value="7">Moscow</option>
  <option value="8">Mumbai</option>
  <option value="9">New York</option>
  <option value="10">Sao Paulo</option>
  <option value="11">Tokyo</option>
</select>

这是ajax div得到空白/填充:

<div role="region" id="city-info" aria-live="polite">
<!-- AJAX CONTENT LOADED HERE -->
</div>

这是放在ajax div中的复选框列表:

<fieldset id="building-selector" aria-controls="building-table">
  <legend>Select your favorite building:</legend>  
  <input id="fox-plaza" type="checkbox" name="buildings" value="fox-plaza">
  <label for="fox-plaza">Fox Plaza</label><br>
  <input id="chrysler-building" type="checkbox" name="buildings" value="chrysler-building"> …

我从 create-react-app 的新副本开始。然后我运行弹出，并想添加代码分割。但是，每当我添加

splitChunks: {
        automaticNameDelimiter: '.',
        chunks: 'all',
      },

该应用程序卡在正在启动开发服务器...

如果我删除chunks: all该应用程序将再次开始工作。

注意：我根本没有改变任何其他内容。

1. npx create-react-app my-app --template typescript
2. cd 我的应用程序
3. npm 运行弹出
4. 编辑 webpack.config.js
5. npm 启动
6. 卡在启动开发服务器上......

我没有收到任何错误或任何关于如何找出问题所在的有用信息。它只是卡住了，有什么想法可能是错误的，或者我可以做些什么来获得更多关于卡住的地方的调试信息吗？

webpack.config.js

module.exports = function (webpackEnv) {
  const isEnvDevelopment = webpackEnv === "development";
  const isEnvProduction = webpackEnv === "production";

  const isEnvProductionProfile =
    isEnvProduction && process.argv.includes("--profile");

  const env = getClientEnvironment(paths.publicUrlOrPath.slice(0, -1));

  const shouldUseReactRefresh = env.raw.FAST_REFRESH;

  // common function to get style loaders
  const getStyleLoaders = (cssOptions, preProcessor) => {
    const loaders …

基本思想是在reactjs中生成jQuery的slideToggle()动画。

隐藏一个元素并根据其状态显示它相当简单，但实际上对高度进行动画处理，使其看起来像上下滑动，似乎比我在reactjs中想象的更复杂。我用谷歌搜索过这种类型的动画，但找不到任何东西。

我发现的最接近的是人们说使用“max-height”css 属性并用它来制作动画，但是，这要求您在想要制作动画的所有 div 上设置最大高度。对于响应式内容来说，这并不是正确的方法。在一个屏幕上所需的最大高度可能是 200，但在移动设备上可能是 500！

到目前为止，我可以轻松地折叠/展开具有状态的组件，就像我所说的那样，但是如何将其扩展为实际的动画？并处理中间动画点击，以便在需要时返回？

height-0 css 类就是这样的：

.height-0 {
    overflow: hidden;
    max-height: 0;
}



import React, { Component, PropTypes } from 'react';

export default class CollapsableComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      collapsed: false
    };
  }

  toggleCollapse(){
    this.setState({
      ...this.state,
      collapsed: this.state.collapsed ? false : true;
    });
  }

  render() {
    return (    
      <div class="row">
        <div class="col-sm-12">
          <h2>Some Title....
            <button class="btn btn-default pull-right" onClick={this.toggleCollapse}>
              <span class={`fa fa-${collapsed ? 'expand' : 'compress'}`} aria-hidden="true"/>
            </button>
          </h2> …

直到最近，我一直只使用 lodash 的 cloneDeep 来复制我的状态，然后更改值并返回克隆的状态。例如像这样：

这将是我的初始状态：

{
    "id": 1213,
    "title": "Some title...",
    "pages": {
        "page1": {
            "id": 459,
            "title": "Some Page title...",
            "fields": {
                "field_1": {
                    "title": "My field",
                    "type": "text",
                    "value": "my text value..."
                },
                "field_2": {
                    "title": "My field 2",
                    "type": "text",
                    "value": "my text two value..."
                },
                "field_3": {
                    "title": "My field 3",
                    "type": "text",
                    "value": "my text value..."
                }
            }
        }
    }
}

现在，我想更新field_2的值。

我的 redux 减速器看起来像这样：

import cloneDeep from 'lodash/fp/cloneDeep';

export default function …

我们的PCI扫描失败了,因为ColdFusion具有可预测的CFID.我们得到的确切失败是"可预测的Cookie会话ID".现在CFTOKEN不再可预测,因为我已经配置CF以使用UUID用于CFTOKEN,但是,CFID仍然是可预测的,并且不受CF Admin中任何更改的影响.

我真的不知道为什么CFID可预测是一种威胁,但他们希望我们修复它.

我一直无法通过googeling找到任何关于此事的任何事情,我真的不确定还能做什么.

有没有其他人处理过这样的事情？有什么建议？

编辑:这是我的Application.cfc文件的样子:

<cfcomponent output="false">

    <cfset this.name="DatabaseOnline">
    <cfset this.sessionManagement=true>
    <cfset this.setDomainCookies=true>
    <cfset this.setClientCookies=true>
    <cfset this.sessionTimeOut=#CreateTimeSpan(0,20,0,0)#>

</cfcomponent> 

我的CF管理员看起来像这样:http://i.imgur.com/k9OZH.png

那么如何禁用CFID？

我一直在尝试将输入格式化为每三个字符一个空格,直到句点字符.

例如:

999999999 => 999 999 999

33333.25 => 33 333.25

222.32 => 222.32

4444 => 4 444

这是我到目前为止:

$(this).on('keyup', function(){
            $(this).val( $(this).val().replace(/(\d{3})(?=.)/g, "$1 ") ); 
        });

但这导致了这个:

999999999 => 999 999 999好的

33333.25 => 333 33.25不行

222.32 => 222 .32不行

4444 => 444 4不行