7
票
承認済み
text/babel とはなんですか?
MDNの<script>要素のドキュメントを読むと
type
スクリプトを表すタイプを指定します。この属性の値は、以下の種類のいずれかにします。
省略または JavaScript の MIME タイプ: これはスクリプトが JavaScript であることを示します。 HTML5 仕様書では、冗長な MIME タイプを指定せずに属性を省略するよう主張しています。...
2
票
承認済み
ReactでAxiosを使用し結果を表示する仕組みで、mapのエラー(TS105)となる
searchResult.mapをラップしている({})が不要ですね。
<ul></ul>の中身を次のように置換すると良いでしょう。
{searchResult !== null && searchResult.map((item: any) => {
return <li>{item.volumeInfo.title}</li&...
2
票
Vue や React では JSX のような JavaScript の構文拡張の使用が必須ですか?
JSX
JSX は JavaScript や TypeScript の構文を拡張する物です。
基本的には、トランスコンパイラなどと呼ばれるツールで、(仮想)DOMを構築する関数の呼び出しに変換されます。
JSX を使用せず、直接これらの関数を呼び出すコードを書いてもかまいません。
https://facebook.github.io/react/docs/react-without-jsx....
1
票
useEffectを実行させたくない
一言で表すと、このような仕様の場合には 「エフェクトではなくイベントハンドラの中で計算する」 のが最良だと思います。
準備として、revenue, cost から revenue を計算する関数を、コンポーネントの外側においておきます。(コンポーネントの状態によらず、入力から出力が決まるように抜き出したので)
const calcProfit = ({ revenue, cost }: { ...
1
票
reactで作成したアプリケーションをアップルストアを介さずに直接iPhoneにインストールすることは可能ですか?
PWA(Progressive Web App) で実現できるのではないでしょうか?
以下のサイトは、PWA として開発されています。
https://www.pwastats.com/
iPhone であれば、サイトを開いて、[共有ボタン] - [ホーム画面に追加] を選択してインストールできます。
通常の Web サイトでも同様のことができますが、見た目の違いとしては、PWA では、URL ...
1
票
承認済み
ReactでWarning: The tag <image> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.が未解決
自己解決しました。
イメージタグのタグ名が間違ってました。
誤:image
正:img
英語のスペルで正しいものがタグ名だと思い込んでいたので、
今後はタグ名が期待する動作をするタグ名かどうか調べて確認します。
1
票
承認済み
Next.js内のJSXでmapで二重ループしたい。
類似質問: reactjsでstateの変更ができない
<ul>
{sortedPostData.map(({ id, title }) => (
colorPattern.map((color) => {
<li className={color} key={id}>
...
1
票
子コンポーネントのuseEffectを発火させないようにするには?
既に解決済みの問題かもしれませんが、一応参考程度の回答を書かせて頂きます。
親コンポーネントが再レンダリングされた場合、子コンポーネントは必ず再レンダリングされるので、構造が兄弟コンポーネントに変えられない場合、そのままのコードでは難しいかと思います。
今回に関しては再レンダリングを防ぎたいわけではなく「重いfetchを一度だけ実行したい」とのことなので、Recoil や Redux ...
1
票
承認済み
React + Typescript + MaterialUI 表にレコードを追加したい
"ここを追加"とコメントアウトした行を追加して見てください。
txHistoryResultAllとステートのtransactionHistoryResultをconcat()で連結した後に、transactionHistoryResultにセットしています。
const clickGet = async () => {
const result = ...
1
票
ReactでAxiosを使用し結果を表示する仕組みで、mapのエラー(TS105)となる
最終的には、
{searchResult !== null && searchResult.items.map((item: any) => {
return (<li key={item.id}>{item.volumeInfo.title}</li>);
})}
というように直しました。
1
票
承認済み
React.jsでコメントアウトができずアロー関数を使った表示ができない
Webサンプルですが、私の方でダウンロードしましたが、問題なく解凍できました。
OS、解凍ソフトは何をお使いですか?
React JSX コメントを書きたい! - かもメモを見ますと、// も使えるが{ }の閉じタグの前に改行が必要。と書いてあります。
{// 一行コメント
}
改行がないと、最後の}もコメントアウトされてエラーになる
{// 一行コメント}
下記のは改行がないようですが、...
1
票
承認済み
JSXで配列をループで回して2個ごとにdivで纏めたい
props.hoges の要素を2つずつまとめてから map するという方針はどうでしょうか?配列の要素をまとめる関数として lodash の chunk を使った例を記載します。
参考: https://lodash.com/docs/#chunk
import _ from 'lodash';
...
render () {
const chunked = _.chunk(this....
1
票
承認済み
1
票
Gatsby, Stripe: 決済ボタン実装をしようとしたら 'Uncaught TypeError: Cannot read property 'configure' of undefined'と出る
解決しました。
public/index.html の直下に以下の内容を書き込むと反映されました。
<script src="checkout.stripe.com/checkout.js"></script>
Only top scored, non community-wiki answers of a minimum length are eligible
関連するタグ
react-jsx × 31reactjs × 27
javascript × 13
typescript × 8
next.js × 5
node.js × 2
react-native × 2
reactive-programming × 2
django × 1
wordpress × 1
vscode × 1
vue.js × 1
npm × 1
axios × 1
babeljs × 1
redux × 1
material-ui × 1
gatsby × 1
react-router-dom × 1
prettier × 1