react native - undefined is not an object(evaluating 'password.toString')
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
So, basically, I have two JavaScript files, in one of them there's a function that authenticates to an API and the other one is the login screen running in the emulator. When I try to authenticate, I get the error:
undefined is not an object (evaluating 'password.toString')
This is the login screen file:
import React, {Component} from 'react';
import {View, Text, TextInput, TouchableOpacity} from 'react-native';
import styles from './login-styles';
import {auth} from '../../fetches/auth';
class LoginBox extends Component {
constructor(props) {
super(props)
this.state = {
username: '',
password: ''
}
}
render = () => {
return(
<View style={styles.box}>
<View style={styles.header}>
<Text style={{fontSize: 28}}>Bem-vindo ao PostBag v 0.0.2</Text>
</View>
<View styles={styles.app}>
<TextInput style={styles.square}
keyboardType="numeric"
placeholder='Insira sua matrúcla'
onChangeText={(text) => this.setState({username: text})}
value={this.state.username}
/>
<TextInput style={styles.square}
secureTextEntry
placeholder='Insira sua senha'
onChangeText={(text) => this.setState({password: text})}
value={this.state.password}
/>
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
<Text style={styles.buttonTxt}>POST</Text>
</TouchableOpacity>
</View>
</View>
)
}
}
export default LoginBox;
This is the authentication function:
import {Alert} from 'react-native';
export function auth(username, password) {
fetch('https://suap.ifrn.edu.br:443/api/v2/autenticacao/token/',
{
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'x-csrftoken': 'NDML6yy6HgTUIoypfWMZHMKZ32lgJf5PsNolVnLgewanw5YM4rqwkuvgkyAhEYEA'
},
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
}).then(function(response) {
var json = response.json()
json.then((data) => {
token = data.token
if (typeof token === 'undefined') {
Alert.alert('Não foi possível fazer login')
}
else {
Alert.alert('Login feito com sucesso')
}
})
})
}
I would really appreciate if anyone could help me with that. Everything that I tried did not work.
javascript reactjs react-native
add a comment |
So, basically, I have two JavaScript files, in one of them there's a function that authenticates to an API and the other one is the login screen running in the emulator. When I try to authenticate, I get the error:
undefined is not an object (evaluating 'password.toString')
This is the login screen file:
import React, {Component} from 'react';
import {View, Text, TextInput, TouchableOpacity} from 'react-native';
import styles from './login-styles';
import {auth} from '../../fetches/auth';
class LoginBox extends Component {
constructor(props) {
super(props)
this.state = {
username: '',
password: ''
}
}
render = () => {
return(
<View style={styles.box}>
<View style={styles.header}>
<Text style={{fontSize: 28}}>Bem-vindo ao PostBag v 0.0.2</Text>
</View>
<View styles={styles.app}>
<TextInput style={styles.square}
keyboardType="numeric"
placeholder='Insira sua matrúcla'
onChangeText={(text) => this.setState({username: text})}
value={this.state.username}
/>
<TextInput style={styles.square}
secureTextEntry
placeholder='Insira sua senha'
onChangeText={(text) => this.setState({password: text})}
value={this.state.password}
/>
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
<Text style={styles.buttonTxt}>POST</Text>
</TouchableOpacity>
</View>
</View>
)
}
}
export default LoginBox;
This is the authentication function:
import {Alert} from 'react-native';
export function auth(username, password) {
fetch('https://suap.ifrn.edu.br:443/api/v2/autenticacao/token/',
{
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'x-csrftoken': 'NDML6yy6HgTUIoypfWMZHMKZ32lgJf5PsNolVnLgewanw5YM4rqwkuvgkyAhEYEA'
},
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
}).then(function(response) {
var json = response.json()
json.then((data) => {
token = data.token
if (typeof token === 'undefined') {
Alert.alert('Não foi possível fazer login')
}
else {
Alert.alert('Login feito com sucesso')
}
})
})
}
I would really appreciate if anyone could help me with that. Everything that I tried did not work.
javascript reactjs react-native
1
What's going on here? =>auth((this.state.username, this.state.password))
. You're using double parentheses for some reason. Isn't that giving you an error? Try removing one set and see if that makes a difference.
– Andy
Nov 24 '18 at 17:39
What happens when you throw aconsole.log('password:', password)
right before yourfetch
call? Make sure you're actually passing the data to the function. The error indicates you might not be passing the data
– mccambridge
Nov 24 '18 at 18:13
add a comment |
So, basically, I have two JavaScript files, in one of them there's a function that authenticates to an API and the other one is the login screen running in the emulator. When I try to authenticate, I get the error:
undefined is not an object (evaluating 'password.toString')
This is the login screen file:
import React, {Component} from 'react';
import {View, Text, TextInput, TouchableOpacity} from 'react-native';
import styles from './login-styles';
import {auth} from '../../fetches/auth';
class LoginBox extends Component {
constructor(props) {
super(props)
this.state = {
username: '',
password: ''
}
}
render = () => {
return(
<View style={styles.box}>
<View style={styles.header}>
<Text style={{fontSize: 28}}>Bem-vindo ao PostBag v 0.0.2</Text>
</View>
<View styles={styles.app}>
<TextInput style={styles.square}
keyboardType="numeric"
placeholder='Insira sua matrúcla'
onChangeText={(text) => this.setState({username: text})}
value={this.state.username}
/>
<TextInput style={styles.square}
secureTextEntry
placeholder='Insira sua senha'
onChangeText={(text) => this.setState({password: text})}
value={this.state.password}
/>
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
<Text style={styles.buttonTxt}>POST</Text>
</TouchableOpacity>
</View>
</View>
)
}
}
export default LoginBox;
This is the authentication function:
import {Alert} from 'react-native';
export function auth(username, password) {
fetch('https://suap.ifrn.edu.br:443/api/v2/autenticacao/token/',
{
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'x-csrftoken': 'NDML6yy6HgTUIoypfWMZHMKZ32lgJf5PsNolVnLgewanw5YM4rqwkuvgkyAhEYEA'
},
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
}).then(function(response) {
var json = response.json()
json.then((data) => {
token = data.token
if (typeof token === 'undefined') {
Alert.alert('Não foi possível fazer login')
}
else {
Alert.alert('Login feito com sucesso')
}
})
})
}
I would really appreciate if anyone could help me with that. Everything that I tried did not work.
javascript reactjs react-native
So, basically, I have two JavaScript files, in one of them there's a function that authenticates to an API and the other one is the login screen running in the emulator. When I try to authenticate, I get the error:
undefined is not an object (evaluating 'password.toString')
This is the login screen file:
import React, {Component} from 'react';
import {View, Text, TextInput, TouchableOpacity} from 'react-native';
import styles from './login-styles';
import {auth} from '../../fetches/auth';
class LoginBox extends Component {
constructor(props) {
super(props)
this.state = {
username: '',
password: ''
}
}
render = () => {
return(
<View style={styles.box}>
<View style={styles.header}>
<Text style={{fontSize: 28}}>Bem-vindo ao PostBag v 0.0.2</Text>
</View>
<View styles={styles.app}>
<TextInput style={styles.square}
keyboardType="numeric"
placeholder='Insira sua matrúcla'
onChangeText={(text) => this.setState({username: text})}
value={this.state.username}
/>
<TextInput style={styles.square}
secureTextEntry
placeholder='Insira sua senha'
onChangeText={(text) => this.setState({password: text})}
value={this.state.password}
/>
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
<Text style={styles.buttonTxt}>POST</Text>
</TouchableOpacity>
</View>
</View>
)
}
}
export default LoginBox;
This is the authentication function:
import {Alert} from 'react-native';
export function auth(username, password) {
fetch('https://suap.ifrn.edu.br:443/api/v2/autenticacao/token/',
{
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'x-csrftoken': 'NDML6yy6HgTUIoypfWMZHMKZ32lgJf5PsNolVnLgewanw5YM4rqwkuvgkyAhEYEA'
},
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
}).then(function(response) {
var json = response.json()
json.then((data) => {
token = data.token
if (typeof token === 'undefined') {
Alert.alert('Não foi possível fazer login')
}
else {
Alert.alert('Login feito com sucesso')
}
})
})
}
I would really appreciate if anyone could help me with that. Everything that I tried did not work.
import React, {Component} from 'react';
import {View, Text, TextInput, TouchableOpacity} from 'react-native';
import styles from './login-styles';
import {auth} from '../../fetches/auth';
class LoginBox extends Component {
constructor(props) {
super(props)
this.state = {
username: '',
password: ''
}
}
render = () => {
return(
<View style={styles.box}>
<View style={styles.header}>
<Text style={{fontSize: 28}}>Bem-vindo ao PostBag v 0.0.2</Text>
</View>
<View styles={styles.app}>
<TextInput style={styles.square}
keyboardType="numeric"
placeholder='Insira sua matrúcla'
onChangeText={(text) => this.setState({username: text})}
value={this.state.username}
/>
<TextInput style={styles.square}
secureTextEntry
placeholder='Insira sua senha'
onChangeText={(text) => this.setState({password: text})}
value={this.state.password}
/>
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
<Text style={styles.buttonTxt}>POST</Text>
</TouchableOpacity>
</View>
</View>
)
}
}
export default LoginBox;
import React, {Component} from 'react';
import {View, Text, TextInput, TouchableOpacity} from 'react-native';
import styles from './login-styles';
import {auth} from '../../fetches/auth';
class LoginBox extends Component {
constructor(props) {
super(props)
this.state = {
username: '',
password: ''
}
}
render = () => {
return(
<View style={styles.box}>
<View style={styles.header}>
<Text style={{fontSize: 28}}>Bem-vindo ao PostBag v 0.0.2</Text>
</View>
<View styles={styles.app}>
<TextInput style={styles.square}
keyboardType="numeric"
placeholder='Insira sua matrúcla'
onChangeText={(text) => this.setState({username: text})}
value={this.state.username}
/>
<TextInput style={styles.square}
secureTextEntry
placeholder='Insira sua senha'
onChangeText={(text) => this.setState({password: text})}
value={this.state.password}
/>
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
<Text style={styles.buttonTxt}>POST</Text>
</TouchableOpacity>
</View>
</View>
)
}
}
export default LoginBox;
import {Alert} from 'react-native';
export function auth(username, password) {
fetch('https://suap.ifrn.edu.br:443/api/v2/autenticacao/token/',
{
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'x-csrftoken': 'NDML6yy6HgTUIoypfWMZHMKZ32lgJf5PsNolVnLgewanw5YM4rqwkuvgkyAhEYEA'
},
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
}).then(function(response) {
var json = response.json()
json.then((data) => {
token = data.token
if (typeof token === 'undefined') {
Alert.alert('Não foi possível fazer login')
}
else {
Alert.alert('Login feito com sucesso')
}
})
})
}
import {Alert} from 'react-native';
export function auth(username, password) {
fetch('https://suap.ifrn.edu.br:443/api/v2/autenticacao/token/',
{
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'x-csrftoken': 'NDML6yy6HgTUIoypfWMZHMKZ32lgJf5PsNolVnLgewanw5YM4rqwkuvgkyAhEYEA'
},
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
}).then(function(response) {
var json = response.json()
json.then((data) => {
token = data.token
if (typeof token === 'undefined') {
Alert.alert('Não foi possível fazer login')
}
else {
Alert.alert('Login feito com sucesso')
}
})
})
}
javascript reactjs react-native
javascript reactjs react-native
edited Nov 24 '18 at 18:08
Heretic Monkey
6,58863673
6,58863673
asked Nov 24 '18 at 17:34
B. VilelaB. Vilela
82
82
1
What's going on here? =>auth((this.state.username, this.state.password))
. You're using double parentheses for some reason. Isn't that giving you an error? Try removing one set and see if that makes a difference.
– Andy
Nov 24 '18 at 17:39
What happens when you throw aconsole.log('password:', password)
right before yourfetch
call? Make sure you're actually passing the data to the function. The error indicates you might not be passing the data
– mccambridge
Nov 24 '18 at 18:13
add a comment |
1
What's going on here? =>auth((this.state.username, this.state.password))
. You're using double parentheses for some reason. Isn't that giving you an error? Try removing one set and see if that makes a difference.
– Andy
Nov 24 '18 at 17:39
What happens when you throw aconsole.log('password:', password)
right before yourfetch
call? Make sure you're actually passing the data to the function. The error indicates you might not be passing the data
– mccambridge
Nov 24 '18 at 18:13
1
1
What's going on here? =>
auth((this.state.username, this.state.password))
. You're using double parentheses for some reason. Isn't that giving you an error? Try removing one set and see if that makes a difference.– Andy
Nov 24 '18 at 17:39
What's going on here? =>
auth((this.state.username, this.state.password))
. You're using double parentheses for some reason. Isn't that giving you an error? Try removing one set and see if that makes a difference.– Andy
Nov 24 '18 at 17:39
What happens when you throw a
console.log('password:', password)
right before your fetch
call? Make sure you're actually passing the data to the function. The error indicates you might not be passing the data– mccambridge
Nov 24 '18 at 18:13
What happens when you throw a
console.log('password:', password)
right before your fetch
call? Make sure you're actually passing the data to the function. The error indicates you might not be passing the data– mccambridge
Nov 24 '18 at 18:13
add a comment |
3 Answers
3
active
oldest
votes
I think, because of that password
or username
is null
or undefined
at that moment. You can check if they are defined and they are strings as below,
body: JSON.stringify({
username: typeof username === 'string' ? username.toString() : '',
password: typeof password === 'string' ? password.toString() : ''
})
and your view should be changed as follow,
onPress={() => auth(this.state.username, this.state.password)}
add a comment |
Delete extra brackets from onPress.
auth(this.state.username, this.state.password)
add a comment |
Change this
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
to
<TouchableOpacity
style={styles.button}
onPress={() => auth(this.state.username, this.state.password)}
>
Also, whenever you're accessing objects with dot operator (.toString()
), it's safe to check if the object is present in the first place.
So it's a good idea to convert this
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
to
body: JSON.stringify({
username: username && username.toString(),
password: password && password.toString()
})
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53460733%2freact-native-undefined-is-not-an-objectevaluating-password-tostring%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
3 Answers
3
active
oldest
votes
3 Answers
3
active
oldest
votes
active
oldest
votes
active
oldest
votes
I think, because of that password
or username
is null
or undefined
at that moment. You can check if they are defined and they are strings as below,
body: JSON.stringify({
username: typeof username === 'string' ? username.toString() : '',
password: typeof password === 'string' ? password.toString() : ''
})
and your view should be changed as follow,
onPress={() => auth(this.state.username, this.state.password)}
add a comment |
I think, because of that password
or username
is null
or undefined
at that moment. You can check if they are defined and they are strings as below,
body: JSON.stringify({
username: typeof username === 'string' ? username.toString() : '',
password: typeof password === 'string' ? password.toString() : ''
})
and your view should be changed as follow,
onPress={() => auth(this.state.username, this.state.password)}
add a comment |
I think, because of that password
or username
is null
or undefined
at that moment. You can check if they are defined and they are strings as below,
body: JSON.stringify({
username: typeof username === 'string' ? username.toString() : '',
password: typeof password === 'string' ? password.toString() : ''
})
and your view should be changed as follow,
onPress={() => auth(this.state.username, this.state.password)}
I think, because of that password
or username
is null
or undefined
at that moment. You can check if they are defined and they are strings as below,
body: JSON.stringify({
username: typeof username === 'string' ? username.toString() : '',
password: typeof password === 'string' ? password.toString() : ''
})
and your view should be changed as follow,
onPress={() => auth(this.state.username, this.state.password)}
edited Nov 24 '18 at 18:29
answered Nov 24 '18 at 18:18
dinindudinindu
2,13211224
2,13211224
add a comment |
add a comment |
Delete extra brackets from onPress.
auth(this.state.username, this.state.password)
add a comment |
Delete extra brackets from onPress.
auth(this.state.username, this.state.password)
add a comment |
Delete extra brackets from onPress.
auth(this.state.username, this.state.password)
Delete extra brackets from onPress.
auth(this.state.username, this.state.password)
answered Nov 24 '18 at 18:18
akcobanakcoban
531111
531111
add a comment |
add a comment |
Change this
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
to
<TouchableOpacity
style={styles.button}
onPress={() => auth(this.state.username, this.state.password)}
>
Also, whenever you're accessing objects with dot operator (.toString()
), it's safe to check if the object is present in the first place.
So it's a good idea to convert this
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
to
body: JSON.stringify({
username: username && username.toString(),
password: password && password.toString()
})
add a comment |
Change this
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
to
<TouchableOpacity
style={styles.button}
onPress={() => auth(this.state.username, this.state.password)}
>
Also, whenever you're accessing objects with dot operator (.toString()
), it's safe to check if the object is present in the first place.
So it's a good idea to convert this
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
to
body: JSON.stringify({
username: username && username.toString(),
password: password && password.toString()
})
add a comment |
Change this
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
to
<TouchableOpacity
style={styles.button}
onPress={() => auth(this.state.username, this.state.password)}
>
Also, whenever you're accessing objects with dot operator (.toString()
), it's safe to check if the object is present in the first place.
So it's a good idea to convert this
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
to
body: JSON.stringify({
username: username && username.toString(),
password: password && password.toString()
})
Change this
<TouchableOpacity
style={styles.button}
onPress={() => auth((this.state.username, this.state.password))}
>
to
<TouchableOpacity
style={styles.button}
onPress={() => auth(this.state.username, this.state.password)}
>
Also, whenever you're accessing objects with dot operator (.toString()
), it's safe to check if the object is present in the first place.
So it's a good idea to convert this
body: JSON.stringify({
username: username.toString(),
password: password.toString()
})
to
body: JSON.stringify({
username: username && username.toString(),
password: password && password.toString()
})
answered Nov 24 '18 at 18:40
Dinesh PandiyanDinesh Pandiyan
2,79811028
2,79811028
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53460733%2freact-native-undefined-is-not-an-objectevaluating-password-tostring%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
What's going on here? =>
auth((this.state.username, this.state.password))
. You're using double parentheses for some reason. Isn't that giving you an error? Try removing one set and see if that makes a difference.– Andy
Nov 24 '18 at 17:39
What happens when you throw a
console.log('password:', password)
right before yourfetch
call? Make sure you're actually passing the data to the function. The error indicates you might not be passing the data– mccambridge
Nov 24 '18 at 18:13