Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
When I console.log(title) I end up getting this object
import React, { Component } from 'react'
class Recommendations extends Component {
constructor (props) {
super(props)
this.state = {
recommendations: [{
url: 'google.com',
pictureUrl: ' ',
rating: -1,
title: 'Yes',
id: -1
}, {
url: 'google.com',
pictureUrl: ' ',
rating: -1,
title: 'Yes',
id: -1
}, {
url: 'google.com',
pictureUrl: ' ',
rating: -1,
title: 'Yes',
id: -1
}]
}
}
changeRating (title) {
console.log(title)
var ratingsChange = this.state.recommendations.slice()
for (var i = 0; i < this.state.recommendations.length; i++) {
if (title === this.state.recommendations[i].title) {
ratingsChange[i].rating++
} else {
ratingsChange[i].rating--
}
}
this.setState({
recommendations: ratingsChange
})
// var currState = this.state
console.log(this.state)
var xhr = require('xhr')
xhr.post('http://127.0.0.1:8000/home/rating/', { json: this.state }, function (err, resp) {
if (err) {
return console.log(err)
}
console.log(resp.body)
return
})
}
handleClick (e, title) {
this.changeRating(title)
}
render () {
return (
<div className={'recommendations'} >
<a href={this.state.recommendations[0].url} target='_blank' onClick={this.handleClick.bind(this, this.state.recommendations[0].title)}>
<img src={this.state.recommendations[0].pictureUrl} alt={this.state.recommendations[0].title}/>
<p>{this.state.recommendations[0].title}</p>
</a>
<a href={this.state.recommendations[1].url} target='_blank' onClick={this.handleClick.bind(this, this.state.recommendations[1].title)}>
<img src={this.state.recommendations[1].pictureUrl} alt={this.state.recommendations[1].title}/>
<p>{this.state.recommendations[1].title}</p>
</a>
<a href={this.state.recommendations[2].url} target='_blank' onClick={this.handleClick.bind(this, this.state.recommendations[2].title)}>
<img src={this.state.recommendations[2].pictureUrl} alt={this.state.recommendations[2].title}/>
<p>{this.state.recommendations[2].title}</p>
</a>
</div>
)
}
componentWillMount () {
var xhr = require('xhr')
xhr.post('http://127.0.0.1:8000/home/', function (err, resp) {
if (err) {
return console.log(err)
}
var response = JSON.parse(resp.body)
console.log(response)
var copyRecommendations = []
for (var i = 0; i < response.length; i++) {
var recommendation = {
url: response[i].fields.url,
pictureUrl: response[i].fields.pictureurl,
rating: response[i].fields.rating,
title: response[i].fields.title,
id: response[i].pk
}
copyRecommendations.push(recommendation)
}
this.setState({
recommendations: copyRecommendations
})
}.bind(this))
}
}
export default Recommendations
Proxy
[[Handler]]
:
Object
set
:
function (target, prop, value)
__proto__
:
Object
[[Target]]
:
SyntheticMouseEvent
altKey
:
(...)
bubbles
:
(...)
button
:
(...)
buttons
:
(...)
cancelable
:
(...)
clientX
:
(...)
clientY
:
(...)
ctrlKey
:
(...)
currentTarget
:
(...)
defaultPrevented
:
(...)
detail
:
(...)
dispatchConfig
:
null
eventPhase
:
(...)
getModifierState
:
(...)
isDefaultPrevented
:
null
isPropagationStopped
:
null
isTrusted
:
(...)
metaKey
:
(...)
nativeEvent
:
(...)
pageX
:
(...)
pageY
:
(...)
relatedTarget
:
(...)
screenX
:
(...)
screenY
:
(...)
shiftKey
:
(...)
target
:
(...)
timeStamp
:
(...)
type
:
(...)
view
:
(...)
_dispatchInstances
:
null
_dispatchListeners
:
null
_targetInst
:
null
preventDefault
:
(...)
stopPropagation
:
(...)
get altKey
:
function get()
set altKey
:
function set(val)
get bubbles
:
function get()
set bubbles
:
function set(val)
get button
:
function get()
set button
:
function set(val)
get buttons
:
function get()
set buttons
:
function set(val)
get cancelable
:
function get()
set cancelable
:
function set(val)
get clientX
:
function get()
set clientX
:
function set(val)
get clientY
:
function get()
set clientY
:
function set(val)
get ctrlKey
:
function get()
set ctrlKey
:
function set(val)
get currentTarget
:
function get()
set currentTarget
:
function set(val)
get defaultPrevented
:
function get()
set defaultPrevented
:
function set(val)
get detail
:
function get()
set detail
:
function set(val)
get eventPhase
:
function get()
set eventPhase
:
function set(val)
get getModifierState
:
function get()
set getModifierState
:
function set(val)
get isTrusted
:
function get()
set isTrusted
:
function set(val)
get metaKey
:
function get()
set metaKey
:
function set(val)
get nativeEvent
:
function get()
set nativeEvent
:
function set(val)
get pageX
:
function get()
set pageX
:
function set(val)
get pageY
:
function get()
set pageY
:
function set(val)
get relatedTarget
:
function get()
set relatedTarget
:
function set(val)
get screenX
:
function get()
set screenX
:
function set(val)
get screenY
:
function get()
set screenY
:
function set(val)
get shiftKey
:
function get()
set shiftKey
:
function set(val)
get target
:
function get()
set target
:
function set(val)
get timeStamp
:
function get()
set timeStamp
:
function set(val)
get type
:
function get()
set type
:
function set(val)
get view
:
function get()
set view
:
function set(val)
get preventDefault
:
function get()
set preventDefault
:
function set(val)
get stopPropagation
:
function get()
set stopPropagation
:
function set(val)
__proto__
:
SyntheticUIEvent
[[IsRevoked]]
:
false
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment