小编Ali*_*ich的帖子

从javascript(而不是单个样式参数)将整个样式字符串设置为元素

我需要通过javascript设置任意样式到跨度.

我知道我可以做这样的事情:span.style.height="250px"; 但我需要能够从模板中插入随机的完整样式定义

例如

float:left; 
text-decoration:underline; 
cursor:pointer; 
color:blue;
Run Code Online (Sandbox Code Playgroud)

有没有办法在Javascript中这样做?就像是:

element.style="all style definition here";

javascript css stylesheet

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

ReactJS setState很慢

我正在尝试使用ReactJS,但是遇到了将其合并到我的表单中的困难.我正在ReactJS中构建一个自动建议表单.在我onChangeQuery,我正在设置状态,然后调用AJAX函数从我的服务器端代码中获取建议; 但是,我注意到这个 loadGroupsFromServer功能没有得到最新状态......这是一个关键的行程太慢了.我知道setState不是即时的,但那我为什么要用setState我的表格呢?使用refs更好吗?最好从中获取价值e.target.value

救命!

  var GroupForm = React.createClass({
    getInitialState: function() {
      return {query: "", groups: []}
    },
    componentDidMount: function () {
      this.loadGroupsFromServer();
    },
    loadGroupsFromServer: function () {
      $.ajax({
        type: "GET",
        url: this.props.url,
        data: {q: this.state.query},
        dataType: 'json',
        success: function (groups) {
          this.setState({groups: groups});
        }.bind(this),
        error: function (xhr, status, err) {
          console.error(this.props.url, status, err.toString());
        }.bind(this)
      });
    },
    onChangeQuery: function(e) {
      this.setState({query: e.target.value})
      this.loadGroupsFromServer();
    },
    render: function() {
      return (
        <div>
          <form class="form …
Run Code Online (Sandbox Code Playgroud)

reactjs

26
推荐指数
5
解决办法
2万
查看次数

如何从右边开始将背景位置设置为绝对距离?

我想设置一个背景图像一个div,在某种程度上,这是在上RIGHT的div,但有固定10px的顶部和右侧的距离.

如果想要它在div 的上部LEFT中,我将如何做到这一点:

background: url(images/img06.gif) no-repeat 10px 10px;

反正是有达到同样的效果,但显示在上背景RIGHT

css

23
推荐指数
4
解决办法
6万
查看次数

圆坐标到Javascript中的数组

在JavaScript中将圆的坐标添加到数组的最佳方法是什么?到目前为止,我只能做半圈,但我需要一个公式,将整个圆圈返回到两个不同的数组:xValuesyValues.(我正在尝试获取坐标,以便我可以沿路径设置对象的动画.)

这是我到目前为止所拥有的:

circle: function(radius, steps, centerX, centerY){
    var xValues = [centerX];
    var yValues = [centerY];
    for (var i = 1; i < steps; i++) {
        xValues[i] = (centerX + radius * Math.cos(Math.PI * i / steps-Math.PI/2));
        yValues[i] = (centerY + radius * Math.sin(Math.PI * i / steps-Math.PI/2));
   }
}
Run Code Online (Sandbox Code Playgroud)

javascript arrays geometry formula

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

JavaScript中的ParseFloat函数

当我添加两个文本框值为1.0010.001然后我做了parseFloat我得到1.0019999999.我想要它1.002.你能帮助我吗?

javascript floating-point parsefloat

12
推荐指数
4
解决办法
2万
查看次数

React.js未捕获错误:不变违规更新列表

有一个页面包含许多图像,基本上是一个图像库.可以更新库页面以包括新的或删除现有的图像条目.使用以下函数创建图像的条目,第一次调用函数,成功完成,后续调用,处理更新的模型,失败,异常

'未捕获错误:不变违规 '.

是什么导致了这个?

render: function () {
  var imageEntries = this.props.map(function (entry) {
    var divStyle = {
      backgroundImage: 'url(' + entry.preview + ')',
    };
    return React.DOM.div({key: entry.key, className: 'image-stream-entry'},
      React.DOM.div({className: 'image', style: divStyle}),
        imageMetadata(entry)
      );
   });

  return (
   React.DOM.div(null, imageEntries)
 );
}
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

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

React/Flux和xhr /路由/缓存

这更像是"你的意见是什么/我在思考这个问题时是否正确?" 题.

在理解Flux的同时尽量严格,我试图找出XHR调用的位置,处理websockets /外部刺激,路由发生等等.

从我阅读的文章,访谈和浏览facebook示例中,我可以通过几种方式处理这些问题.严格遵循flux,Action创建者是执行所有XHR调用的人,可能PENDING/SUCCESS/FAILURE在请求完成之前和之后触发Actions.
另一个是,来自facebook的Ian Obermiller,所有READ(GET)请求都由Stores直接处理(没有Action创建者/调度员的参与),WRITE(POST)请求由Action Creators处理整个action>dispatcher>store流程.

我们提出/想要坚持的一些理解/结论:

  1. 理想情况下,进出系统的任何事情都只能通过Actions进行.
  2. 离开/进入系统的异步调用将具有PENDING/PROGRESS(think file uploads)/SUCCESS/FAILURE动作.
  3. 整个App中的单一调度程序.
  4. Action>Dispatcher>Store 调用是严格同步的,以坚持调度无法在内部启动另一个调度以避免链接事件/操作.
  5. 存储在视图中持久存在(考虑到它是单页面应用程序,您希望能够重用数据)

我们得出一些结论的一些问题,但我并不完全满意:

  1. 如果采用Stores do Reads和Actions to Writes的方法,您如何处理多个Stores可能能够使用来自单个XHR调用的数据的情况?
    示例:TeamStore发出的API调用/api/teams/{id}返回类似于:

        {  
            entities: {  
                teams: [{  
                    name: ...,  
                    description: ...,  
                    members: [1, 2, 4],  
                    version: ...  
                }],  
                users: [{  
                    id: 1  
                    name: ...,  
                    role: ...,  
                    version: ...  
                },  
                {  
                    id: 2  
                    name: ...,  
                    role: ...,  
                    version: ...  
                },  
                {  
                    id: 3  
                    name: ...,  
                    role: ...,  
                    version: ...  
                }]  
            } …
    Run Code Online (Sandbox Code Playgroud)

javascript reactjs reactjs-flux

12
推荐指数
2
解决办法
2040
查看次数

根据用户更改主题/ CSS

我正在构建一种产品,我们最终将采用白标.现在我正试图找出以编程方式促进这些要求的最佳方法,以便用户可以通过其个人资料/设置表单更新网站的基本设计(即标题颜色等).

要求:

  1. 用户可以更新徽标(这是完整的)
  2. 用户可以更新基本设计元素(基于CSS),即页眉颜色,页脚颜色,侧边栏颜色 - 所有基本CSS覆盖

我们不想使用ASP.Net主题/皮肤,因为这需要在本地文件系统中存储静态主题.我们想使用CSS覆盖基本样式并将其存储在数据库中.

我们的初始计划是将CSS存储在数据库中的一个简单varchar字段中,并使用"!"将该CSS写入Pre-Init事件的主页面.覆盖基本样式.这是最好的解决方案吗?如果没有,你做了什么来完成这个功能/

css asp.net

10
推荐指数
2
解决办法
6592
查看次数

使用BUTTON元素在ReactJS中提交表单

关于我的情况的一些说法:我正在使用ReactJS构建表单,如果它有<input type="submit">元素,它工作正常:通过按Enter键input[type="text"]并按下提交元素提交表单(并且如果没有提交表单,还有ReactJS的工作检查已经改变).

但是,如果我更换input[type="submit"]<button>ButtonLabel</button>我尝试使用2种方式:

  1. 获取表单DOMNode元素并调用.submit()方法,这是不正确的,因为它不使用内部ReactJS逻辑

  2. 将params传递给按钮, <button type="submit" form="form-id"> 但它仍然不使用ReactJS检查(如果没有任何更改,我不想提交表单)

所以如果有人建议我如何使用BUTTON元素正确地在ReactJS中提交表单,我将非常感激.

谢谢!

reactjs

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

propTypes isRequired约束错误导致反应行为

我很反应(或说网络技术).我开始构建一个使用不同组件的应用程序.当我浏览文档时,我想放入isRequiredpropTypes,约束用户isRequired在使用组件时提供所有属性.

但是,在这个例子中,即使我没有传递isRequired属性,我也可以加载组件.

var PanelPreview = React.createClass({
    getInitialState: function(){
       return { captionIndex: 0 };
    },
    propTypes: {
       beforeSrc: React.PropTypes.string.isRequired,
       afterSrc: React.PropTypes.string.isRequired,
       captionTable: React.PropTypes.array
    },
});
module.exports = PanelPreview;
Run Code Online (Sandbox Code Playgroud)

使用此组件的应用:

   React.render(
      < PanelPreview />,
      document.getElementById('main')
   );
Run Code Online (Sandbox Code Playgroud)

我想约束组件的用户提供这两个值,否则会抛出某种错误.

javascript reactjs

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