我刚刚使用NPM更新了我的项目，我不清楚是什么导致了以下错误。 prefixer.js来自radium。
Uncaught TypeError：无法读取未定义的属性'toString' - 前缀.js：173
_getPrefixedValue @ prefixer.js：173（匿名函数）@ prefixer.js：275getPrefixedStyle @ prefixer.js：261resolveStyles @ resolve-styles.js：215（匿名函数）@ resolve-styles.js：154mapSingleChildIntoContext @ ReactChildren.js：97traverseAllChildrenImpl @ traverseAllChildren.js：111traverseAllChildrenImpl @ traverseAllChildren.js：133traverseAllChildren @ traverseAllChildren.js：246mapChildren @ ReactChildren.js：123resolveStyles @ resolve-styles.js：152render @ enhancer.js：34_renderValidatedComponentWithoutOwnerOrContext @ ReactCompositeComponent.js：789_renderValidatedComponent @ ReactCompositeComponent.js：816wrapper @ ReactPerf.js：70mountComponent @ ReactCompositeComponent.js：237wrapper @ ReactPerf.js：70mountComponent @ ReactReconciler.js：38mountChildren @ ReactMultiChild.js：192_createContentMarkup @ ReactDOMComponent.js：289mountComponent @ ReactDOMComponent.js：199mountComponent @ ReactReconciler.js：38mountComponent @ ReactCompositeComponent.js：247wrapper @ ReactPerf.js：70mountComponent @ ReactReconciler.js：38_updateRenderedComponent @ ReactCompositeComponent.js：764_performComponentUpdate @ ReactCompositeComponent.js：726updateComponent @ ReactCompositeComponent.js：642wrapper @ ReactPerf.js：70performUpdateIfNecessary @ ReactCompositeComponent.js：539performUpdateIfNecessary @ ReactReconciler.js：115runBatchedUpdates @ ReactUpdates.js：151perform @ Transaction.js：134perform @Transaction.js：134perform @ ReactUpdates.js：95flushBatchedUpdates @ ReactUpdates.js：175wrapper @ ReactPerf.js：70closeAll @Transaction.js：207perform @ Transaction.js：148batchedUpdates @ ReactDefaultBatchingStrategy.js：66enqueueUpdate @ ReactUpdates.js：215enqueueUpdate @ ReactUpdateQueue.js：30enqueueSetState @ ReactUpdateQueue.js：208ReactComponent.setState @ ReactComponent.js：69onChange @ Player.js：61emit @ index.js：72AltStore.emitChange @ AltStore.js：54（匿名函数）@ AltStore.js：84Dispatcher。$ Dispatcher_invokeCallback @ Dispatcher.js：220Dispatcher.dispatch @ Dispatcher.js：195（匿名 函数）@ index.js：74Alt.batchingFunction @ index.js：58dispatch @ index.js：73dispatch @ index.js：43setSource @ PlayerActions.js：6（匿名函数）@ Album.js：38（匿名 功能）@ Album.js：77fire @ jquery.js：3099fireWith @ jquery.js：3211done @jquery.js:8264jQuery.ajaxTransport.send.callback @ jquery.js：8605
行this.setState(PlayerStore.getState())似乎触发了我的PlayerStore来自Alt。
这是我的Player.js文件，其中包含具有以上行的组件：
var React = require('react');
var Radium = require('radium');
var _ = require('underscore');
var Utils = require('../../utils/Utils');
/*** CONSTANTS ***/
var LayoutColors = require('../../constants/LayoutColors');
var LayoutSizes = require('../../constants/LayoutSizes');
var LayoutFonts = require('../../constants/LayoutFonts');
/*** COMPONENTS ***/
var PlayerSize = require('./PlayerSize');
var YouTube = require('../YouTube/YouTube');
var PlayerControlsTop = require('./PlayerControlsTop');
var PlayerControlsBottom = require('./PlayerControlsBottom');
var PlayerHeader = require('./PlayerHeader');
var PlayerSource = require('./PlayerSource');
/*** FLUX ***/
var PlayerStore = require('../../stores/PlayerStore');
var PlayerActions = require('../../actions/PlayerActions');
var Player = React.createClass({
propTypes: {
},
getDefaultProps: function() {
return {};
},
getInitialState: function(){
return PlayerStore.getState();
},
componentWillMount: function() {
// PlayerActions.setSource(this.props.id, this.props.type, this.props.playingTrack);
},
componentWillReceiveProps: function(nextProps) {
/*
if(nextProps.id != this.props.id
|| nextProps.type != this.props.type){
PlayerActions.setSource(nextProps.id, nextProps.type, nextProps.playingTrack);
}
else if(!_.isEqual(nextProps.playingTrack, this.state.playingTrack)){
PlayerActions.setSource(nextProps.id, nextProps.type, nextProps.playingTrack);
}
*/
},
componentDidMount: function() {
PlayerStore.listen(this.onChange);
},
componentWillUnmount: function() {
//MAY COME BACK TO THIS... WILL NEVER NEED TO UNMOUNT
//PlayerActions.unMount();
PlayerStore.unlisten(this.onChange);
},
onChange: function() {
var toSet = PlayerStore.getState();
console.log('##### 1 #####');
console.log(toSet);
this.setState(toSet);
},
/*** Youtube Events ***/
onReady: function(event) {
PlayerActions.setPlayer(event.target);
},
onDestroy: function() {
console.log('onDestroy()');
// PlayerActions.setPlayer(null);
},
onProgressBarChange: function(current, total, perc) {
PlayerActions.setProgressBar(current, total, perc);
},
onPlay: function() {
PlayerActions.setPlaying(true);
},
onPause: function() {
PlayerActions.setPlaying(false);
},
onEnd: function() {
PlayerActions.forward();
},
/*** Render ***/
render: function() {
console.log('##### 2 #####');
console.log(this.state);
var hover = Radium.getState(this.state, 'player', ':hover');
var youtubeOptions = {
height: '100%',
width: '100%',
playerVars: { // https://developers.google.com/youtube/player_parameters
start: this.state.start,
autoplay: 1,
controls: 0,
showinfo: 0,
rel: 0,
iv_load_policy: 3
}
};
var youtubeElement = (this.state.playingTrack && this.state.playingTrack[this.state.mode]) ?
<YouTube
videoId={this.state.playingTrack[this.state.mode].youtubeId}
opts={youtubeOptions}
onReady={this.onReady}
onDestroy={this.onDestroy}
onPlay={this.onPlay}
onPause={this.onPause}
onProgressBarChange={this.onProgressBarChange}
onEnd={this.onEnd} />
: <div style={{height: '100%', width: '100%', backgroundColor: 'black'}}></div>;
if(this.state.source){
var favoriteTrack = false;
if(this.state.playingTrack){
favoriteTrack = this.state.playingTrack.favorite;
}
var by = null;
if(this.state.source.type == 'playlist'){
by = this.state.source.owner;
}
else if(this.state.source.type == 'album'){
by = this.state.source.artist;
}
return (
<div key="player" style={containerStyle} >
<PlayerSize />
<div style={mainStyle}>
<PlayerControlsTop
hover={hover}
playingTrack={this.state.playingTrack} />
<div style={youtubeStyle} >
{youtubeElement}
</div>
<PlayerControlsBottom
hover={hover}
perc={this.state.perc}
current={this.state.current}
total={this.state.total}
playing={this.state.playing}
mute={this.state.mute}
random={this.state.random}
repeat={this.state.repeat}
favoriteTrack={favoriteTrack} />
</div>
<PlayerHeader
title={this.state.source.title}
by={by}
type={Utils.capitalizeFirstLetter(this.state.source.type)}
hover={hover}
radio={this.state.radio} />
<PlayerSource
type={this.state.source.type}
tracks={this.state.source.tracks}
favorite={this.state.favorite}
playingTrack={this.state.playingTrack}
mode={this.state.mode}
hover={hover} />
</div>
);
}
else{
return (
<div style={containerStyle}></div>
);
}
}
});
/*** STYLES ***/
var containerStyle = {
position: 'fixed',
zIndex: 2,
right: 0,
bottom: 0,
top: LayoutSizes.topHeight,
backgroundColor: LayoutColors.darkGrey,
color: LayoutColors.darkGreyText,
width: LayoutSizes.rightWidth,
borderLeft: '1px solid '+LayoutColors.black,
':hover': {}
};
var mainStyle = {
backgroundColor: LayoutColors.black
};
var youtubeStyle = {
height: LayoutSizes.playerHeightSmall,
position: 'relative',
zIndex: 2
};
module.exports = Radium(Player);
答案 0 :(得分：0)
前缀调用toString的唯一时间是value of a property when it is not a string。因此，如果您看到此错误，则必须将null或undefined作为某个属性的值传递。镭应该只是警告你这个并忽略它。
我们会跟踪此over on GitHub。