小编Bok*_*oky的帖子

我正在尝试更新Django数据库中的用户.

提取的数据如下:

fetched_data = {
     'id': 1,
     'first_name': 'John',
     'last_name': 'Doe',
     'phone': '+32 12',
     'mobile_phone': '+32 13',
     'email': 'myemail@hotmail.com',
     'username': 'myusername'
}

我得到这个id的用户如下:

old_user = User.objects.get(pk=fetched_data['id'])

如果我按如下方式更新用户:

old_user.username = fetched_data['username']
old_user.first_name = fetched_data['first_name']
......
old_user.save()

它工作正常,但我不想为每条记录都这样做,因此我尝试了类似的东西:

for fetched_data_key in fetched_data:
    old_user.fetched_data_key = fetched_data['fetched_data_key']
    //old_user[fetched_data_key] = fetched_data['fetched_data_key'] --- I tried this way to
    old_user.save()

但这不起作用.任何想法如何更新用户而不为每条记录做这件事？

我有一个redux chrome扩展的问题.

我在configureStore.js文件中有以下代码:

import {createStore, applyMiddleware} from 'redux';
import rootReducer from '../reducers/index';
import thunk from 'redux-thunk';

export default function configureStore(initialState){
  return createStore(
    rootReducer,
    initialState,
    applyMiddleware(thunk),
    window.devToolsExtension ? window.devToolsExtension() : f => f
  );
}

我window.devToolsExtension ? window.devToolsExtension() : f => f在教程中添加了类似内容.

但是当我尝试运行扩展时,我得到了

编辑

import 'babel-polyfill';
import React from 'react';
import {render} from 'react-dom';
import {Router, browserHistory} from 'react-router';
import routes from './routes';
import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
import './assets/sass/main.scss';
import '../node_modules/font-awesome/css/font-awesome.css';

import {loadCourses} from './actions/courseActions';
import {loadAuthors} from './actions/authorActions'; …

主App组件中的代码如下:

class App extends Component {
  componentDidMount(){
      console.log(this.ref);
      debugger;
  }

  render() {

    return (
        <div>
            <Header/>
            {this.props.children}
            <Footer/>
        </div>
    );
  }
}

呈现的组件之一{this.props.children}是HomePage,其中是带有refs的部分.

HomePage的代码如下:

render(){
     return (
        <div className="homeMain">
            <section ref="info"> <Info/> </section>

            <section ref="contact"> <Contact /> </section>
       </div>
    );
}

如何在App组件中获取这些引用,以便能够将它们作为道具传递给标头？

我正在尝试在App组件中的componentDidMount中执行此操作,但它console.log(this.refs)是空的.

有什么建议？

编辑

整个App组件:

import React, {Component} from 'react';
import Footer from './common/footer';
import Header from './common/header';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import * as actions from './components/homepage/login/authActions';

class App extends …

我正在尝试使用React创建一个滑动事件.我不想使用任何外部组件或jquery.

css类似于:

.outter{
  position:relative;
  width: 100%;
  height: 150px;
  background-color: blue;
}

.inner{
  position: absolute;
  width: 1000%; 
  left: 50px;
}
.child{
  float: left;
  margin-right: 15px;
}

在反应组件中,我正在尝试做类似的事情:

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

    this.state = {
        left: 0
    }
  }

  handleSwipe(){
    this.setState({left: -350})
  }

  render(){
    return(
        <div className="outter">
            <div className="inner" style={{left: this.state.left}} onSwipe={this.handleSwipe.bind(this)}>
                 <div className="child"><img src="http://placehold.it/350x150" /></div>
                 <div className="child"><img src="http://placehold.it/350x150" /></div>
                 <div className="child"><img src="http://placehold.it/350x150" /></div>
                 <div className="child"><img src="http://placehold.it/350x150" /></div>
            </div>
      </div>
    )
  }
}

React.render(<Test />, document.getElementById('container'));

如何识别滑动事件？

如果我在我的示例中而不是onSwipe …

我正在尝试使用onChange另一个输入字段的功能更改复选框的值.

我有这样的事情:

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

        this.state = {
            minValue: 0,
            maxValue: 20000,
            step: 1000,
            firstValue: null,
            secondValue: null,
            chcboxValue: false
        };

        this.handleChange = this.handleChange.bind(this);
    }

    componentWillMount() {
        this.setState({firstValue: this.state.minValue, secondValue: this.state.maxValue});
    }

    handleChange(name, event) {
        let value = event.target.value;
        // We set the state value depending on input that is clicked
        if(name === "second") {
            if(parseInt(this.state.firstValue) < parseInt(value)) {
                this.setState({secondValue:value});
            }
        } else {
            // The first value can't be greater than the …

我遇到问题的代码部分是:

constructor(props){
    super(props);

    this.state = {
        allcars: null,

        minValue: 0,
        maxValue: 50000,
        step: 1000,
        firstValue: null,
        secondValue: null,
        chcboxValue: false,

        chcboxManualValue: false,
        chcboxAutomaticValue: false
    };

    this.handleFilterChange = this.handleFilterChange.bind(this);
    this.handlePriceUpdating = this.handlePriceUpdating.bind(this);
    this.updateCarsToShow = this.updateCarsToShow.bind(this);
    this.handleTransmissionUpdating = this.handleTransmissionUpdating.bind(this);
    this.resetPriceFilter = this.resetPriceFilter.bind(this);
    this.resetTransimissionFilter = this.resetTransimissionFilter.bind(this);
}

componentWillMount(){
    this.setState({firstValue: this.state.minValue, secondValue: this.state.maxValue, allcars: this.props.carsToShow});
}

componentWillReceiveProps(nextProps) {
    //We get the filter which is removed
    let isRemoved = this.props.filters.filter(i => {
        return nextProps.filters.filter(a => {
            return i.searchFilter[0] !== a.searchFilter[0];
        });
    });


    //If something is …

我正在尝试使用React JS和react-router创建一个多步骤表单.

表单步骤随状态而变化.如果我单击下一步按钮,状态步骤将递增,并显示下一步.

但是这样,如果我在第三步,我点击浏览器中的后面,我被重定向到主页而不是上一步.

我的主要组件是这样的:

componentWillMount(){
    console.log(this.props.params.id);
}

onButtonClick(name, event) {
    event.preventDefault();

    switch (name) {
        case "stepFourConfirmation":
            if(this.validation("four")) {
                this.props.actions.userRegistrationThunk(this.state.user);
                this.setState({step: 5, user: {}});
            }
            break;
        case "stepTwoNext":
            if(this.validation("two")) {
                this.setState({step: 3});
                this.context.router.push("stepThree");
            }
            break;
        case "stepThreeFinish":
            this.setState({step: 4});
            break;
        default:
            if(this.validation("one")) {
                this.setState({step: 2});
                this.context.router.push('stepTwo');
            }
    }
}

在每个按钮上单击我将参数推送到URL并更改步骤.当我点击下一步它的工作完美.在componentWillMount中,我试图从url获取参数,我会根据参数减少步骤.

但只有当第一步加载时我才会在控制台中执行stepOne.如果我点击下一步我得到[react-router]位置"stepTwo"与任何路线都不匹配

我的routes.js文件如下:

    import React from 'react';
import {IndexRoute, Route} from 'react-router';

import App from './components/App';
import HomePage from './components/HomePage';
import Registration from './components/registration/RegistrationPage';

import UserPage from './components/user/userHome';
import requireAuth …

我想在AsyncStorage.setItem里面用AsyncStorage.getItem。如何以正确的方式做到这一点？

我的代码如下：

createVehicle: function (vehicle, cb) {
    AsyncStorage.getItem('vehicle')
    .then(json => {

        let vehicles = [];

        if (json) {
            vehicles = JSON.parse(json);
            let o_vehicle = filter(vehicles, {autralis_id: vehicle.autralis_id});
            if (o_vehicle.length > 0) {
                cb(o_vehicle[0].id);
                return;
            } else {
                vehicles.push(vehicle);
            }
        } else {
            vehicles.push(vehicle);
        }
        AsyncStorage.setItem('vehicle', JSON.stringify(vehicles), () => {
            cb(vehicle.id + 1)
        });
    }).done();
},

这是正确的方法吗？

I'm trying to create a multi step registration form using React and Redux.

The main component is as follows :

import React, {PropTypes} from 'react';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import * as actionCreators from '../../actions/actionCreators';
import countries from '../../data/countries';

import RegistrationFormStepOne from './registrationFormStepOne';
import RegistrationFormStepTwo from './registrationFormStepTwo';
import RegistrationFormStepThree from './registrationFormStepThree';
import RegistrationFormStepFour from './registrationFormStepFour';

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

        this.state = {
            user: Object.assign({}, this.props.userData),
            fileNames: {},
            selectedFile: {},
            icons: {
                idCard: …

我有一个对象数组如下:

let cars = [
    {"id":20,"mileage":41300,"make":"Golf", initialRegistration:"09/02/2010"}, 
    {"id":21,"mileage":51300,"make":"Passat", initialRegistration:"06/04/2012"},
    {"id":22,"mileage":61300,"make":"Audi", initialRegistration:"02/01/2018"},
    {"id":23,"mileage":20300,"make":"Touran", initialRegistration:"17/09/2013"},
    {"id":24,"mileage":10300,"make":"Polo", initialRegistration:"26/07/2014"}
];

我想按它排序initialRegistration.

我尝试按如下方式进行:

let sortedCars = cars.sort((a, b) => Date.parse(a.initialRegistration) - Date.parse(b.initialRegistration));

let sortedCars1 = cars.sort((a, b) => new Date(a.initialRegistration) - new Date(b.initialRegistration));

let sortedCars2 = cars.sort((a, b) => new Date(a.initialRegistration).getTime() - new Date(b.initialRegistration).getTime());

但这些尝试都没有奏效.我得到的结果是:

Golf - 09/02/2010
Passat - 06/04/2012
Audi - 02/01/2018
Touran - 17/09/2013
Polo - 26/07/2014

这是小提琴.