Access HTML node not generated by React - reactjs

Question

I have this in the head of my mark up:
it generates a random ID which comes from PHP
I need to pass the value of the attrbiute content inside my AXIOS post:
submitForm (e) {
e.preventDefault();
var current = this.props.currentState;
axios({
url: '/save-data',
method: 'POST',
contentType: 'application/json',
data: {
"candidate": {
"first_name": current.name,
"last_name": this.state.lastName,
"email": this.state.email,
"university": this.state.location,
"degree_area": this.state.degree,
"year_of_graduation": this.state.year
},
"tshirt": {
"color_id": current.activeColorTextID,
"options": [{
"icon_id": current.optionA.icon_id,
"option_id": current.optionA.option_id
}, {
"icon_id": current.optionB.icon_id,
"option_id": current.optionB.icon_id
}, {
"icon_id": current.optionC.icon_id,
"option_id": current.optionC.icon_id
}]
}
},
headers: { 'Content-Type': 'application/json' }
}).then(function(response){
console.log(response);
});
}
this is the jQuery version:
$(function() {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax({
url: '/save-data',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({
"candidate": {
"first_name": "",
"last_name": "",
"email": "",
"university": "UCL",
"degree_area": "IT",
"year_of_graduation": "2016"
},
"tshirt": {
"color_id": 1,
"options": [{
"icon_id": 1,
"option_id": 2
}, {
"icon_id": 2,
"option_id": 5
}, {
"icon_id": 4,
"option_id": 12
}]
}
}),
dataType: 'json'
});
});
but I need to achieve it in React.
can react access that HTML element content attribute?

Answer 1

You could easily use document.querySelector:
submitForm (e) {
e.preventDefault();
var current = this.props.currentState;
axios({
url: '/save-data',
method: 'POST',
contentType: 'application/json',
data: {
"candidate": {
"first_name": current.name,
"last_name": this.state.lastName,
"email": this.state.email,
"university": this.state.location,
"degree_area": this.state.degree,
"year_of_graduation": this.state.year
},
"tshirt": {
"color_id": current.activeColorTextID,
"options": [{
"icon_id": current.optionA.icon_id,
"option_id": current.optionA.option_id
}, {
"icon_id": current.optionB.icon_id,
"option_id": current.optionB.icon_id
}, {
"icon_id": current.optionC.icon_id,
"option_id": current.optionC.icon_id
}]
}
},
headers: {
'Content-Type': 'application/json',
'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').attributes['content'].value
}
}).then(function(response){
console.log(response);
});
}