Use vue3, vite, less, flask, python to learn Silicon Valley takeaway from scratch (Episodes 41-82)

Episode 41: I encountered a big pitfall here, because this kind of project has many pages. Sometimes some pages will cause errors if I forget to save them. It is also difficult to troubleshoot, and it wasted almost half a day of my time. You can automatically save and open the vscode code, so you won't run into pitfalls in the future.
Episode 42: Nothing much to say.
Episode 43: Just follow this as written, but be more rigorous and set the cache cookie time in the background. But I won’t go into details here. You can also use localStorage to do it, which is more in line with business logic.
Episode 44: Here we use element-plus directly without any hassle. Because we have just started using it, in order to better experience the usage specifications of elementplus instead of being busy using plug-ins, we will not introduce it as needed here, and you can modify it later.
Insert image description here

Episode 45: It’s not difficult, the code is universal for vue3.
Episode 46, Episode 47: Talk about some concepts and very good design ideas. If you have understood the grammar, you should gain something from these lessons.
Episode 48, Episode 49: No proxy is needed here because mockjs intercepts the request and handles it in the frontend.
Episode 50: A knowledge point in this episode is that no error will be reported when the value of an empty object is undefined, but an error will be reported when the value is taken out again, because undefined cannot be revalued.
Episode 51: Writing the following pages from here will be a little more complicated. There is a pitfall where the less variable cannot be read. This is how I solved it.
Insert image description here

Episode 52: In this episode, the idea of ​​using v-if if the image cannot be requested is also very good.
Episode 53: It is also a very important idea to mark the current category with the class name. These episodes are difficult, easy to understand, and difficult to write by yourself, but there is no need to worry. This is the essence of the entire training institution in Shang Silicon Valley. It is normal for individuals to not reach this level for the time being. Just learn this logic.
Episodes 55-59: This sliding component rewrites many native events. I won’t go into details here. I’ll talk about bugs later.
Episode 60: There is a pit here. There is a problem with the source code. Because the cartControl component is positioned using position, and its parent element uses the flexible box flex layout, so it will appear at the bottom and cannot be seen. Here is what to do You can see it by changing the positioning method of the parent element content to relative.
Episode 61: Beginners are often confused as to whether parentheses should be added to the parameter food passed in here. In fact, the teacher has not taken care of the audience here. As long as the action and mutation are unified, parentheses can be added or not. Vue3 has been improved here, so it can be updated directly without Vue.set.
Episode 62: Provides a simple method for parent components to call child components. Of course, you can also use methods in vuex, similar to the global bus. This method of calling child components from a parent component is
Episode 64: The difference between calculated properties and vuex is very important in this episode.
Episode 77: There are no difficulties in the previous part. In this episode, the teacher changed the name of the previous headerTop to headTop. If you copy it directly, an error will be reported. What is said in the video here is actually problematic. In the search component, the longitude and latitude are not used when querying merchants by name. However, it is written in the interface, and the data in the state is hard-coded, so it cannot be found. You can only change the interface in the background.
Episode 81: Filter has been abandoned in vue3. Instead of using moment, it is better for us to customize a time format module ourselves. It is simple and you can customize the function yourself, put it in the api folder, and then introduce it in the shoprating component. Just add one line to method.
Insert image description here

The effect is complete.
Episode 82: I originally wanted to talk about packaging together, but there were a lot of errors and I have never packaged it before, so I will write another article when the time comes.
Source code Github address https://github.com/cmgfz/-2023vue3-vite-less-flask-

Guess you like

Origin blog.csdn.net/returnadsss/article/details/129096150