reactjs

问题 I am in the process of upgrading the dependencies of a React project. I upgraded styled-components from 1.4.4 to 2.5.0-1 . I didn't expect any breaking changes since I read that styled-components v2 is a drop-in replacement for v1. I don't see any breaking changes in the web app, but my test cases are broken. Consider the following, dumb and useless test. test('does something', () => { expect(true).toBe(true); }); As expected, the test works. However, as soon as I even try to import a styled

问题 I am trying to add Jest and Enzyme to a React webpack project. Everything is working, until I add tests to a component, with a style sheet importing google fonts. The error I get is: ● Test suite failed to run /Users/dev/Code/Git/react-redux-webpack/src/App.sass:1 ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){@import url('https://fonts.googleapis.com/css?family=Barlow+Condensed') ^ SyntaxError: Invalid or unexpected token The sass file looks like:

问题 I am trying to add Jest and Enzyme to a React webpack project. Everything is working, until I add tests to a component, with a style sheet importing google fonts. The error I get is: ● Test suite failed to run /Users/dev/Code/Git/react-redux-webpack/src/App.sass:1 ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){@import url('https://fonts.googleapis.com/css?family=Barlow+Condensed') ^ SyntaxError: Invalid or unexpected token The sass file looks like:

问题 I have an object which i want to update it using React Hooks const [rowEdit, setRowEdit] = useState({ rowEdit: { "1x0": [1, 1, 1, 1, 1] } }); I loop through the array with .map, so i have the index for each element. How can i make the second value equal to 0? 回答1: You can return 0 if the map index is equal to 1 , or return the current element otherwise. Example const { useState } = React; function App() { const [rowEdit, setRowEdit] = useState({ rowEdit: { "1x0": [1, 1, 1, 1, 1] } });

问题 I have an object which i want to update it using React Hooks const [rowEdit, setRowEdit] = useState({ rowEdit: { "1x0": [1, 1, 1, 1, 1] } }); I loop through the array with .map, so i have the index for each element. How can i make the second value equal to 0? 回答1: You can return 0 if the map index is equal to 1 , or return the current element otherwise. Example const { useState } = React; function App() { const [rowEdit, setRowEdit] = useState({ rowEdit: { "1x0": [1, 1, 1, 1, 1] } });

问题 How can I use alert() to allow the user to enter their name, and save it to state? Here is what I have attempted so far: render: function() { return ( <div> <input type="text" onChange={ this.handleChange } /> <Button>Save</Button> </div> ); } } 回答1: One option would be to use the prompt() function, which displays a modal dialog through which user input can be entered and acquired. The prompt() method also allows you to supply a custom greeting, which can be passed as the first argument like

问题 How can I use alert() to allow the user to enter their name, and save it to state? Here is what I have attempted so far: render: function() { return ( <div> <input type="text" onChange={ this.handleChange } /> <Button>Save</Button> </div> ); } } 回答1: One option would be to use the prompt() function, which displays a modal dialog through which user input can be entered and acquired. The prompt() method also allows you to supply a custom greeting, which can be passed as the first argument like

问题 How to set import shortcuts/aliases in create-react-app? From this: import { Layout } from '../../Components/Layout' to this: import { Layout } from '@Components/Layout' I have a webpack 4.42.0 version. I don't have a webpack.config.js file in the root directory. I've tried to create one myself with this code inside: const path = require('path') module.exports = { resolve: { alias: { '@': path.resolve(__dirname, 'src/'), } } }; But it doesn't seem to work. I've seen the NODE_PATH=. variant in

问题 How to set import shortcuts/aliases in create-react-app? From this: import { Layout } from '../../Components/Layout' to this: import { Layout } from '@Components/Layout' I have a webpack 4.42.0 version. I don't have a webpack.config.js file in the root directory. I've tried to create one myself with this code inside: const path = require('path') module.exports = { resolve: { alias: { '@': path.resolve(__dirname, 'src/'), } } }; But it doesn't seem to work. I've seen the NODE_PATH=. variant in

问题 I'm new to react native and I would like to create a simple app working with firebase push notifications. So I've created my react app using 'expo init' Now I'm stuck at point 2 of this tutorial https://github.com/invertase/react-native-firebase-docs/blob/master/docs/installation/android.md In the tutorial, it says "apply xyz to your android/app/build.gradle" but the problem is that I have no such file, also in many other tutorials of react native this file is mentioned... do I have to create