您好,我正在使用 react js,任何建議和建議都非常感謝。sharedfields forEach 回圈執行 console.log 的 sharedFieldAlias 值,如果我在回圈之外 console.log 它不會輸出該值。我需要在 span 標記中顯示 sharedFieldAlias 值,但它給出了一個未定義 sharedFieldAlias 的參考錯誤。如何在 span 標簽中顯示值?
sharedfields.forEach((sharedField) => {
let sharedFieldAlias = sharedField.alias;
if(value.shared_field_uuid == sharedField.uuid) {
console.log(sharedFieldAlias);
}
});
const fullLabel = (
<div style={{ display: 'flex', alignItems: 'center' }}>
<InputLabel label={display_name} help={parameter.help?.header_id} />
{!isLinked ? (
<LinkOutlined onClick={linkField} style={{ color: blue.primary }} />
) : (
<div>
<CloseSquareOutlined
onClick={unlinkField}
style={{ color: yellow[7] }}
/>
<span className="ant-typography ant-typography-secondary" id="sharedFieldAlias" style={{ marginLeft: '5px', color: '#262626'}}>
{sharedFieldAlias}
</span>
</div>
)}
</div>
);
uj5u.com熱心網友回復:
在回圈外宣告變數sharedFieldAlias(在您的情況下,就在回圈上方)。
let sharedFieldAlias;
<your loop goes here>
uj5u.com熱心網友回復:
您必須在回圈外宣告變數。使用 for 回圈而不是 forEach 也可能會有所幫助,這樣您就可以在找到值后跳出回圈。
let sharedFieldAlias;
for (const sharedField of sharedfields) {
if (value.shared_field_uuid == sharedField.uuid) {
sharedFieldAlias = sharedField.alias;
console.log(sharedFieldAlias);
break;
}
}
uj5u.com熱心網友回復:
不需要全域變數。用于find檢查陣列,找到 uuid 匹配的物件,并回傳別名,否則回傳 'None'。
const sharedFields = [
{ alias: 'Bob', uuid: '1' },
{ alias: 'Carol', uuid: '2' },
{ alias: 'Sam', uuid: '3' },
{ alias: 'Moses', uuid: '4' }
];
function getAlias(fields, uuid) {
const found = fields.find(field => {
return uuid === field.uuid;
});
return found ? found.alias : 'None';
}
console.log(getAlias(sharedFields, '3'));
console.log(getAlias(sharedFields, '31'));
console.log(getAlias(sharedFields, '2'));
這是 React 中的一個小型作業示例。
function getAlias(fields, uuid) {
const found = fields.find(field => {
return uuid === field.uuid;
});
return found ? found.alias : 'None';
}
function Example({ data }) {
return (
<div>
<div>{getAlias(data, '3')}</div>
<div>{getAlias(data, '31')}</div>
<div>{getAlias(data, '2')}</div>
</div>
);
}
const data = [
{ alias: 'Bob', uuid: '1' },
{ alias: 'Carol', uuid: '2' },
{ alias: 'Sam', uuid: '3' },
{ alias: 'Moses', uuid: '4' }
];
ReactDOM.render(
<Example data={data} />,
document.getElementById('react')
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/17.0.2/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/17.0.2/umd/react-dom.production.min.js"></script>
<div id="react"></div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/469078.html
標籤:javascript 反应
上一篇:將字串連接到雙引號內的變數
