小编Dmi*_*dov的帖子

Visual Studio Code现在支持0.8版本的JSX,但看起来激活它的唯一方法是使用.jsx文件扩展名.列表中没有手动更改语言模式,最近的选项是JavaScriptReact,但它不解析JSX标记.

我在一个带有很多.jsJSX文件的项目中,我无法改变它.

有没有其他方法可以在没有.jsx扩展名的情况下使用JSX语法？

我遇到了关于鼠标光标在我的SVG文档中的位置的麻烦.我想在HTML页面中使用JavaScript设计一个在拖动时跟随光标的电位计.

我尝试了evt.clientX/Y和evt.screenX/Y,但由于我的SVG处于自动缩放状态,因此我的SVG中的坐标是不同的.我现在一直在寻找答案,但我找不到任何解决方案(要么实时了解我的SVG重新缩放因子,要么在SVG坐标系统中具有鼠标位置功能).

轮换将遵循一个简单的规则:

if(evt.screenX <xc)

ang = Math.atan((evt.screenY - yc)/(evt.screenX - xc))*360 /(2*Math.PI) - 90;
if(evt.screenX> xc)
ang = Math.atan((evt.screenY - yc)/(evt.screenX - xc))*360 /(2*Math.PI)+ 90;

用(xc; yc)作为旋转中心,用SVG中鼠标的坐标替换所有evt.screenX/Y.

我有一个AngularJS指令,我想在其中添加一个svg标签到指令的当前元素.现在我在jQuery的帮助下做到这一点

link: function (scope, iElement, iAttrs) {

    var svgTag = $('<svg width="600" height="100" class="svg"></svg>');
    $(svgTag).appendTo(iElement[0]);

    ...
    }

但我不希望该指令依赖于jQuery来完成这个简单的任务.我将如何使用AngularJS意味着(或本机JavaScript代码)完成相同的操作.

在我的React组件中,我有一个按钮,用于在单击时通过AJAX发送一些数据.我只需要第一次发生,即在第一次使用后禁用按钮.

我是怎么做的:

var UploadArea = React.createClass({

  getInitialState() {
    return {
      showUploadButton: true
    };
  },

  disableUploadButton(callback) {
    this.setState({ showUploadButton: false }, callback);
  },

  // This was simpler before I started trying everything I could think of
  onClickUploadFile() {
    if (!this.state.showUploadButton) {
      return;
    }
    this.disableUploadButton(function() {
      $.ajax({
        [...]
      });

    });
  },

  render() {
    var uploadButton;
    if (this.state.showUploadButton) {
      uploadButton = (
        <button onClick={this.onClickUploadFile}>Send</button>
      );
    }

    return (
      <div>
        {uploadButton}
      </div>
    );
  }

});

我认为发生的是状态变量showUploadButton没有立即更新,React docs所说的是预期的.

我怎么能强制按钮被禁用或在点击它的瞬间全部消失？

例如,我想显示一个名单.所以我想做这样的事情:

var returnValue;
for (eachName of _names) {
  returnValue += (
  <TouchableHighlight
    onPress={() => this._onPressButton}>
      <Text>
      {eachName}
      </Text>
  </TouchableHighlight>);
}
return returnValue;

但是,这是无效的.这让我想到了一个问题:如何在React Native中连接动态数量的JSX组件.

我正在我的网络应用程序中实现令牌身份验证.我的access token每N分钟过期,而不是refresh token用于登录并获得新的access token.

我使用Axios进行所有API调用.我有拦截器设置来拦截401响应.

axios.interceptors.response.use(undefined, function (err) {
  if (err.status === 401 && err.config && !err.config.__isRetryRequest) {
    serviceRefreshLogin(
      getRefreshToken(),
      success => { setTokens(success.access_token, success.refresh_token) },
      error => { console.log('Refresh login error: ', error) }
    )
    err.config.__isRetryRequest = true
    err.config.headers.Authorization = 'Bearer ' + getAccessToken()
    return axios(err.config);
  }
  throw err
})

基本上,当我拦截401响应时,我想进行登录,然后使用新令牌重试原始被拒绝的请求.我的serviceRefreshLogin函数调用setAccessToken()它的then块.但问题是then阻塞发生的时间晚于getAccessToken()拦截器,因此重试发生在旧的过期凭证上.

getAccessToken()并getRefreshToken()简单地返回存储在浏览器中的现有标记(它们管理localStorage,cookies等).

在承诺返回之前,我将如何确保语句不会执行？

(这是github上的相应问题:https://github.com/mzabriskie/axios/issues/266)

在React JSX中,我如何才能将以下文本包含在单引号中？还是其他可能需要转义的标点符号？

 return (
   <div>
     <p>I've seen the movie.</p>
   </div>     
 )

我正在尝试建立一个基本的反应示例 - 使用jspm/systemjs和babel.我在这里有这个代码来显示一个简单的页面,我收到一个错误

import React from 'react';

export default React.createClass({
displayName: 'MainComponent',
propTypes: {
    item: React.PropTypes.object
},
render: function render() {
    return (
        <div class="builder-conteiner">

        <div>;
    );
}
});

React.render(<MainComponent />, document.getElementById('app'))

没有任何东西出现,控制台错误的"未终止的JSX内容",并且babel指向react.render行,如下所示:

 17 | React.render(<MainComponent />, document.getElementById('app'))
    |                               ^ 

这还是新手,所以我不确定这里出了什么问题,不胜感激任何帮助.谢谢!

是否可以在HTML的主流中显示由jQuery AJAX调用返回的图像？

我有一个脚本绘制带有标题的图像(图像/ PNG).当我在浏览器中调用它时,会显示图像.

但是当我在这个脚本上使用jQuery进行AJAX调用时,我无法显示干净的图像,我有很多奇怪的符号.这是我的脚本,使图像具有标题(图像/ PNG).

#!/usr/bin/perl 

use strict;
use CGI;
use Template;
use CGI::Carp qw(fatalsToBrowser);
use lib qw(lib);
use GD;

my $cgi    = new CGI;

my $id_projet            =  $cgi   -> param('id_projet') ;      # 

# Create a new image
my $image = new GD::Image(985,60) || die;
my $red =  $image->colorAllocate(255, 0, 0);
my $black =  $image->colorAllocate(0, 0, 0);

$image->rectangle(0,0,984,59,$black);
$image->string(gdSmallFont,2,10,"Hello $id_projet ",$black);
# Output the image to the browser

print $cgi -> header({-type => 'image/png',-expires => '1d'});

#binmode STDOUT;

print …

我正在尝试创建一个密码确认功能,只有在用户离开确认字段后才会出现错误.我正在使用Facebook的React JS.这是我的输入组件:

<input
    type="password"
    placeholder="Password (confirm)"
    valueLink={this.linkState('password2')}
    onBlur={this.renderPasswordConfirmError()}
 />

这是renderPasswordConfirmError:

renderPasswordConfirmError: function() {
  if (this.state.password !== this.state.password2) {
    return (
      <div>
        <label className="error">Please enter the same password again.</label>
      </div>
    );
  }  
  return null;
},

当我运行页面时,输入冲突的密码时不会显示该消息.