小编Bok*_*oky的帖子

在React JS中要求带有变量的文件

我正在尝试在路径中要求一个带变量的文件.就像是

const langCode = this.props.langCode; // en
let languageFile = require('../common/languages/' + langCode);
Run Code Online (Sandbox Code Playgroud)

其中langCode可以是fr,en,de,nl.因此,我想要得到的是例如

require('../common/languages/en'); 
Run Code Online (Sandbox Code Playgroud)

当我在最后输入没有变量的时候,因此require('../common/languages/en');效果很好.但是当我尝试使用require('../common/languages/' + langCode);它将无法工作时,langCode的值也是en 无关紧要.

我得到下一个错误:

bundle.js:1未捕获错误:找不到模块'../common/languages/en'

UPDATE

    'use strict';

var gulp = require('gulp');
var connect = require('gulp-connect');
var open = require('gulp-open');
var browserify = require('browserify');
var source = require('vinyl-source-stream');
var concat = require('gulp-concat');
var babelify = require('babelify');
var sass = require('gulp-sass');
var merge = require('merge-stream'); // Merge all styles (css, sass and less) in one …
Run Code Online (Sandbox Code Playgroud)

javascript require browserify reactjs gulp

5
推荐指数
1
解决办法
5060
查看次数

React - 数组或迭代器中的每个子节点都应该有一个唯一的"key"prop

我在React JS组件中的关键道具有问题.

我越来越

警告:数组或迭代器中的每个子节点都应该具有唯一的"键"支柱.检查Login的render方法.它从App传递了一个孩子.

控制台日志中的警告.App组件如下:

import React from 'react';
import Header from '../common/header';
import HeaderCompact from '../common/headerCompact';
import Footer from '../common/footer';


class App extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      lang: 1
    };
  }

  changeLang(name, event) {
    event.preventDefault();
    switch (name) {
      case "fra" :
        this.setState({lang: 2});
        break;
      case "ger" :
        this.setState({lang: 3});
        break;
      case "ned" :
        this.setState({lang: 4});
        break;
      default:
        this.setState({lang: 1});
    }
  }


  render() {
    let currentRoute = this.props.location.pathname.slice(1);
    let header = currentRoute === "" ? <Header …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

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

使用React JS的FadeIn和FadeOut效果

我有这样的事情:

var Hello = React.createClass({
    getInitialState: function(){
    return {
        opacity: 0
    }
  },

  handleClick: function(event){
    event.preventDefault();
    this.setState({opacity: 1});
  },

  render: function() {
    return <div>
        <div style={{opacity: this.state.opacity, transition: "opacity 1s"}}>Test</div>
      <a href="" onClick={this.handleClick}>Click</a>
    </div>;
  }
});

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

这是 jsfiddle

我希望内部文本测试的div不显示在页面加载上.然后,如果我点击该div显示的链接.这就是这个例子的作用.

但是我希望在点击后显示div之后,几秒钟后它会再次消失.(我需要以某种方式将不透明度再次设置为0).

有什么建议?

javascript css

4
推荐指数
1
解决办法
3714
查看次数

无法发布错误反应js

我得到一个空白页面,错误为无法 POST /registration/step-two

我正在尝试创建多步注册。我的主要组件的渲染功能如下:

render() {
    const languageReg = this.props.currentLanguage.default.registrationPage;


    let stepOne = (this.props.params.id == 'step-one') ? <RegistrationFormStepOne actionSaveUser={this.props.actionSaveUser} currentLanguage={languageReg}/> : "";
    let stepTwo = (this.props.params.id == 'step-two') ? <RegistrationFormStepTwo actionSaveUser={this.props.actionSaveUser} currentLanguage={languageReg}/> : "";

    return (
        <div className="sidebar-menu-container" id="sidebar-menu-container">

            <div className="sidebar-menu-push">

                <div className="sidebar-menu-overlay"></div>

                <div className="sidebar-menu-inner">
                    <div className="contact-form registrationForm">
                        <div className="container">
                            <div className="row">
                                <div className="col-md-10 col-md-offset-1 col-md-offset-right-1">
                                    {stepOne}
                                    {stepTwo}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    );
}
Run Code Online (Sandbox Code Playgroud)

在 RegistrationFormStepOne 中,我具有单击功能,如下所示:

handleClick(){
    let data = {name: "stepOne", values: [this.state.user]}; …
Run Code Online (Sandbox Code Playgroud)

reactjs react-router

4
推荐指数
1
解决办法
9155
查看次数

在儿童点击上获取父ID

我试着用jquery点击获取父ID.

我的django模板如下:

<table id="archive-table" class="table table-hover table-vcenter">
    <thead>
       <tr>
          <th>Make and model</th>
          <th>First registration</th>
       </tr>
    </thead>
    <tbody>
       {% for calculation in calculations %}
          <tr data-archive-row class="archive-row" data-calculation-id={{ calculation.id }}>
               <td>{{ calculation.first_registration }}</td>
               <td>{{ calculation.body }}</td>
           </tr>
       {% endfor %}
     </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

我的js如下:

<script>
    $(document).ready(function () {
        $('#archive-table').on('click', '[data-archive-row]', function (e) {
            var calculation_id = e.target.dataset['calculationId'];
            alert(calculation_id)
        })
    });
</script>
Run Code Online (Sandbox Code Playgroud)

dataset['calculationId']如果我点击了孩子,我怎么能得到父母的.

使用我的代码,我在警报中未定义.但是,如果我例如添加data-calculation-id={{ calculation.id }}到一个td,如果我然后点击它然后我得到正确的ID.

有没有办法从父母那里获得id,无论是点击了孩子还是父母?

javascript jquery

4
推荐指数
1
解决办法
504
查看次数

用Python中的字典循环遍历字典列表的正确方法

我有车辆列表和过滤器字典.代码如下:

过滤词典如下:

filters = {
  'make': 'SKODA',
  'model': 'Fabia',
  'fuel': 'Diesel',
  'transmission': '',
  'registration_year': '',
  'price': {'start': 10000, 'stop': 12000}
}
Run Code Online (Sandbox Code Playgroud)

车辆清单如下:

vehicles = [
  {'make': 'AUDI', 'model': 'Q2 Dsl', 'type': '1.6 TDi Sport', 'fuel': 'Diesel', 'mileage': '19896', 'registration_year': '2017', 'transmission': 'Handbediende versnellingsbak', 'price': 17800}, 
  {'make': 'AUDI', 'model': 'A6 SW Dsl', 'type': '2.0 TDi S line', 'fuel': 'Diesel', 'mileage': '87354', 'registration_year': '2013', 'transmission': 'Handbediende versnellingsbak', 'price': 52000},
  {'make': 'SKODA', 'model': 'Fabia', 'type': '1.6 CR TDi GreenLine Active DPF', 'fuel': 'Diesel', …
Run Code Online (Sandbox Code Playgroud)

python

4
推荐指数
1
解决办法
96
查看次数

重复的键值违反了 Django 中的唯一约束

我有在 django 中创建新用户的功能,如下所示:

def initialize(username, password, email, title, firstName, lastName,  telephoneNumber, mobileNumber, smsActive, for_company_id = 1):
    sUsername = username.lower()
    if len(username) > 30:
        sUsername = username[:30].lower()
    user = User.objects.create_user(sUsername, email, password, last_login=datetime.datetime.now())
    user.first_name = firstName
    user.last_name = lastName
    user.save()
    userProfile = UserProfile(user = user, title = title, telephone = telephoneNumber, mobile = mobileNumber, smsActive = smsActive)
    userProfile.code2Factor = pyotp.random_base32()
    userProfile.forCompanyId = for_company_id
    userProfile.main_updated = datetime.datetime.now()
    userProfile.save()
    return userProfile
Run Code Online (Sandbox Code Playgroud)

然后我这样做:

user_profile = initialize(input.user.username, password, '', input.title, input.user.first_name, input.user.last_name, input.telephone, input.mobile, sms_active) …
Run Code Online (Sandbox Code Playgroud)

python django

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

通过单击子 div 来防止 onClick 事件

我正在尝试在 React JS 中创建一个模态

我有一个外部 div,它是整个身体,而我有一个内部 div。如果在内部 div 之外单击它,我想应用该函数来关闭模态。

我的代码如下:

popupOutterDivStyle() {
    return {
        zIndex: 10000,
        position: "fixed",
        width: "100%",
        height: "100%",
        top: 0,
        left: 0,
        background: "rgba(102,102,102,0.8)"
    }
}

popupInnerDivStyle() {
    return {
        zIndex: 20000,
        position: "fixed",
        width: "70%",
        top: "50%",
        left: "50%",
        height: "400px",
        marginTop: "-200px", /*set to a negative number 1/2 of your height*/
        marginLeft: "-35%", /*set to a negative number 1/2 of your width*/
        background: "rgba(255,255,255,1)",
        display: 'block'
    }
}

closePopupIcon() {
    return {
        position: "absolute", …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

3
推荐指数
1
解决办法
3230
查看次数

如何在 React JS 中获取元素边距

我正在尝试在 React 中创建一个滑块。

我的组件如下:

outterDivStyles() {
        return {
            position: "relative",
            width: "100%",
            overflow: "hidden",
            height: this.props.height || 200
        }
    }

innerDivStyles(){
    return {
        position: "absolute",
        top: 0,
        left: this.state.left,
        right: 0,
        width: "1000%",
        transition: "left .5s",
        transitionTimingFunction: "ease"
    }
}

renderArrows(){
    return (
        <div className="next-prev" style={{height: this.props.height || 200}}>
            <div onClick={this.prevSlide.bind(this)}><img src={images.slider_arrow_left_png} /></div>
            <div onClick={this.nextSlide.bind(this)}><img src={images.slider_arrow_right_png} /></div>
        </div>
    )
}


render(){
return(
<div>
    <div ref="detailsOutterDiv" className="detailsOutterDiv" style={this.outterDivStyles()}>
         <div ref="detailsInnerDiv" className="detailsInnerDiv" style={this.innerDivStyles()}>
              {this.carInfo().photos.map((p, i) => {
                  return (
                      <div key={i} className="slide"><img …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

3
推荐指数
1
解决办法
7762
查看次数

如何从本机应用程序链接到手机设置

我正在创建一个 react-native 应用程序,如果他们的 IOS 版本< 11.0,我想向用户显示和警告。

这很好用。我有以下几点:

在此处输入图片说明

如果他们点击Go to settings ,我想要的是进入电话设置

代码如下:

Linking.canOpenURL('app-settings:').then(supported => {
    if (!supported) {
        console.log('Can\'t handle settings url');
    } else {
        return Linking.openURL('app-settings:');
    }
}).catch(err => console.error('An error occurred', err));
Run Code Online (Sandbox Code Playgroud)

因此,我尝试使用Linking.openURL('app-settings:'). 但问题是那转到我的应用程序的设置,但我想转到settings索引页甚至更好地system upgrade设置。

我只需要它用于 IOS。

知道我该怎么做吗?

ios react-native

3
推荐指数
1
解决办法
1996
查看次数