Conversation
Use nth-child in css selector.
When hover on todo list it will be zoom in.
By add key into every component div.
Use for movie search.
clonn
left a comment
clonn
left a comment
There was a problem hiding this comment.
有思考到架構的部分，還有如何拆解的方向，
裡面有指出一些方向，可以多參考一下～
| module.exports = { | ||
| async requestMovieInfo (search = "Batman") { | ||
| let {data : info} = await axios.get(`http://www.omdbapi.com/?s=${search}&apikey=34472924`) | ||
| return info |
There was a problem hiding this comment.
如果沒有要重複給值的話，建議可以用 const 做宣告
了解～ 想請問 let 和 const有性能或其他方面上的差異嗎？
src/app.js
Outdated
| } | ||
|
|
||
| async searchKwd (kwd) { | ||
| if (!kwd) kwd = "banana"; |
There was a problem hiding this comment.
給個建議， kwd 縮寫固然好，對於易讀性來說，還是直接取名字為 keyword 會更為直接容易閱讀
| if (this.state.showPage == "todo") { | ||
| show = <Todo todos = {todos} /> | ||
| } | ||
|
|
There was a problem hiding this comment.
建議會將這一大段拉出來成為一個 function 或者一個 Show component 來處理, 這樣在閱讀的時候會更為輕鬆容易
src/components/Product.js
Outdated
| ) | ||
| })} | ||
| </div>); | ||
| } else return <div>Waiting...</div> |
There was a problem hiding this comment.
可以這樣子寫
{
(movies.Search) ?
return (<div> ... ) :
return <div>Waiting...</div>
}
There was a problem hiding this comment.
照著修改有碰到一點小問題，把三元運算子放到 return內後解決，不過感覺上變得有點不好閱讀
| bindCheckBox (inputId) { | ||
| const input = document.getElementById(inputId) | ||
| input.checked = !input.checked | ||
| } |
There was a problem hiding this comment.
會將 input.checked 這個部分，直接從外部帶進來，變成
this.state.checked
處理的時候直接就可以進行
this.setState({
checked: !checked
})
底下的 checkbox checked 就可以跟著 this.state.checked 的數值直接輸出即可，就不用使用 getElementBy ...
There was a problem hiding this comment.
checked
如果是 list 這種動態產生的 checkbox，如何用這個方法來改寫呢？
我想到的方法要根據 list id 建立對應的 state 才能做，不知道有什麼更好的方法嗎？
| } | ||
| .hoverZoom:hover { | ||
| zoom : 1.5; | ||
| } No newline at end of file |
There was a problem hiding this comment.
這邊用到了些 transform, 也不是不好不過如果只是要拿來做定位使用的話， transform 會使用到不少效能，盡量在如果是要對應座標，應該在父結點上面設定上去 position: relative;
If the variable doesn't reassign, suggest to declare to const.
Refactoring code in app.js to improve readability.
From kwd to keyword.
2 participants
This work is very interesting.