小编YPC*_*ble的帖子

可以在DOM中多次使用React.render()吗?

我想使用React在整个DOM中多次添加组件.这个小提琴显示了我想要做的事情,并没有抛出任何错误.这是代码:

HTML:

<div id="container">
    <!-- This element's contents will be replaced with the first component. -->
</div>

<div id="second-container">
    <!-- This element's contents will be replaced with the second component. -->
</div>
Run Code Online (Sandbox Code Playgroud)

JS:

var Hello = React.createClass({
    render: function() {
        return <div>Hello {this.props.name}</div>;
    }
});

React.render(<Hello name="World" />, document.getElementById('container'));

React.render(<Hello name="Second World" />, document.getElementById('second-container'));
Run Code Online (Sandbox Code Playgroud)

我已经看到了这个问题,我担心通过上面的操作,我会冒险让React组件相互干扰.这个问题的答案建议使用服务器端渲染,这对我来说不是一个选项,因为我正在使用Django服务器端.

另一方面,也许我正在做的是好的,因为我只安装了一个React库的实例(而不是多个组件调用它们自己的React实例)?

这种使用多个DOM实例的方式是否可以使用React?

reactjs

98
推荐指数
3
解决办法
4万
查看次数

如何使用react动态设置HTML5数据属性?

我想渲染<select>输入的HTML5属性,以便我可以使用jquery图像选择器进行反应.我的代码是:

var Book = React.createClass({
    render: function() {
        return (
            <option data-img-src="{this.props.imageUrl}" value="1">{this.props.title}</option>
Run Code Online (Sandbox Code Playgroud)

问题是,即使{this.props.imageUrl}正确地传递为a prop,它也不会在HTML中呈现 - 它只是呈现为{this.props.imageUrl}.如何使变量正确传递到HTML中?

reactjs

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

是否有可能在pdb中倒退?

在我点击n来评估一条线之后,我想回去然后点击s以进入该功能,如果它失败了.这可能吗?

文档说:

j(ump)lineno 设置将要执行的下一行.仅适用于最底部的框架.这使您可以跳回并再次执行代码,或者跳转到跳过您不想运行的代码.

python pdb

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

如何将字体图标旋转45度?

我想将这个字体图标旋转45度.该图标有这个CSS(所有CSS通过LESS编译):

[class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after {
  font-family: Flaticon;
  font-size: 20px;
  font-style: normal;
  margin-left: 20px;
}
Run Code Online (Sandbox Code Playgroud)

这就是Flaticon:http://www.flaticon.com/free-icon/hand-pointer_70655

我已将其安装为图标字体.

但是,当我尝试将其旋转45度,以便手指指向右上角时,它不起作用.我正在尝试安装这样的图标:

<i class="flaticon-hand-10 gly-rotate-45"></i>
Run Code Online (Sandbox Code Playgroud)

这是班级gly-rotate-45:

.gly-rotate-45 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0.5);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
Run Code Online (Sandbox Code Playgroud)

浏览器正在启动transform: rotate(45deg);,但图标未旋转.如何旋转此图标字体?

css icons rotation icon-fonts

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

如何从命令行使用节点模块?

我正在使用Mac OSX.我通过Homebrew安装了节点.我已经安装了我的库(MomentJS)npm install -g moment.

当我输入node命令行时,我得到NodeJS控制台,它看起来像:

>

现在,假设我想使用该moment库.如果我输入:

var moment = require('moment');
Run Code Online (Sandbox Code Playgroud)

我收到以下错误:

错误:无法找到模块'时刻'

如何require从命令行使用Node 配置外部库?

node.js

21
推荐指数
1
解决办法
9100
查看次数

如何使用react-native-camera捕获的图像

我可以让react-native-camera模块访问摄像头并保存图像.但是,我无法弄清楚如何向用户显示此图像.

我在尝试什么:

我在这里拍照.这会生成看起来像.jpg文件的内容assets-library://....

    _takePicture() {
        var self = this;
        this.refs.cam.capture(function(err, data) {
          this.setState({photo: data});
          console.log(err, data);
          // data is "assets-library://asset/asset.JPG?id=########-####-####-####-##########&ext=JPG"
          console.log('just took a picture');
        }); 
    }
Run Code Online (Sandbox Code Playgroud)

但是,如果我尝试渲染图像:

    render: function() {
      return(
         <Image style={styles.image} source={{uri: this.state.photo}}/>
      );
    }
Run Code Online (Sandbox Code Playgroud)

我收到此错误:

No suitable image URL loader found for assets-library://asset/asset.JPG?id=.......

如何拍照,将其保存到state我的应用程序的当前状态并进行渲染?

reactjs react-native react-native-camera

19
推荐指数
1
解决办法
7819
查看次数

如何相互验证wtforms字段?

SelectField在表单中有三个相同的输入,每个输入都有相同的选项集.我不能使用一个多选.

我想确保用户为这三个字段选择三种不同的选择.

在自定义验证中,您似乎一次只能引用一个字段,而不是将此字段的值与其他字段进行比较.我怎样才能做到这一点?谢谢!

python validation flask wtforms flask-wtforms

17
推荐指数
2
解决办法
8055
查看次数

使用npm和Django加载CSS静态文件的正确方法是什么?

我想从我的node_modules目录加载我的静态css文件(例如,Bootstrap),如下所示:

{% load staticfiles %}
<link rel="stylesheet" href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}" />
Run Code Online (Sandbox Code Playgroud)

当我.../node_modules/进入我的STATICFILES_DIRS设置时,这是有效的.但是,它还为我的/static/文件夹添加了绝对大量的文件- 主要devDependencies是我不需要访问前端.

通过npm包含某些静态资产的最佳做法是什么,但不包括node_modules/static/文件夹中的所有内容?

或者,包含这么多无关文件是否可以,这是最好的解决方案?

django django-staticfiles

16
推荐指数
2
解决办法
1826
查看次数

防止Python驱动的PhantomJS/Selenium中的CSS /其他资源下载

我试图通过阻止下载CSS /其他资源来加速Python中的Selenium/PhantomJS webscraper.我需要下载的是img src和alt标签.我发现了这段代码:

page.onResourceRequested = function(requestData, request) {
    if ((/http:\/\/.+?\.css/gi).test(requestData['url']) || requestData['Content-Type'] == 'text/css') {
        console.log('The url of the request is matching. Aborting: ' + requestData['url']);
        request.abort();
    }
};
Run Code Online (Sandbox Code Playgroud)

via:如何控制PhantomJS跳过下载某种资源?

如何/在哪里可以在由Python驱动的Selenium中实现此代码?或者,还有另一种更好的方法来阻止CSS /其他资源下载吗?

注意:我已经找到了如何通过编辑service_args变量来阻止图像下载:

如何在python webdriver中为phantomjs/ghostdriver设置代理?

PhantomJS 1.8与python上的Selenium.如何阻止图像?

但是service_args无法帮助我使用像CSS这样的资源.谢谢!

python selenium web-scraping headless-browser phantomjs

14
推荐指数
1
解决办法
6583
查看次数

如何使用命名空间调用Django Rest Framework URL?

我有一个urls.py看起来像这样:

router = SimpleRouter()
router.register(r'meetings', MeetingViewSet, 'meetings-list')

urlpatterns = patterns('clubs.views',
    url(r'^(?P<pk>\d+)/', include(router.urls)),
    url(r'^amazon/$', AmazonView.as_view(), name="amazon"),)
Run Code Online (Sandbox Code Playgroud)

我想引用'meetings-list'url reverse,如:

url = reverse('meetings-list')

但是当我尝试这个时,我得到了 NoReverseMatch: Reverse for 'MeetingViewSet' with arguments '()' and keyword arguments '{}' not found. 0 pattern(s) tried: []

有没有办法使用Django Rest Framework?

django namespaces django-rest-framework

13
推荐指数
1
解决办法
4764
查看次数