- 博客(94)
- 收藏
- 关注
RSS订阅原创 单文件组件和html文件的区别，同一个题目任务
单文件组件：<script setup>import { reactive, watchEffect } from 'vue'//import { reactive，watchEffect } from 'vue'//import { reactive } from 'vue' //const { reactive, watchEffect } = Vue; const state = reactive({ count: 0 }) watchEffect(
2021-10-29 18:52:45
177
原创 reactive, watchEffect两个函数有关的单文件组件的例子
<script setup>import { reactive, watchEffect } from 'vue'//import { reactive，watchEffect } from 'vue'//import { reactive } from 'vue' //const { reactive, watchEffect } = Vue; const state = reactive({ count: 0 }) watchEffect(() =>
2021-10-29 18:26:50
96
原创 单文件组件的例子
<script setup>import { reactive } from 'vue'const state = reactive({ count: 0})</script><template> <div> count值： {{ state.count }} </div> </template>输出：count值：0
2021-10-29 18:15:20
76
原创 什么是单文件组件？
<script>export default { data() { return { greeting: 'Hello World!' } }}</script><template> <p class="greeting">{{ greeting }}</p></template><style>.greeting { color: red; font-weig
2021-10-29 17:10:50
1665
原创 原来是因为const App写成app了
<!DOCTYPE html><html> <head> </head><div id="app"> <button @click="increment">count 值： {{ state.count }} </button></div> <script src="https://unpkg.com/vue@next"></sc
2021-10-29 11:23:35
141
原创 还是不知道在项目里怎么摆setup，单文件html里知道
错误的。<template> <div id="app"> <button type="button" @click="increment">count值：{{ state.count }}</button> </div></template><script>export default { name: 'HelloWorld', const App = { setup(){
2021-10-29 11:18:43
129
1
原创 这样为什么也不行？
<!DOCTYPE html><html> <head> </head><div id="app"> <button @click="increment">count 值： {{ state.count }} </button></div> <script src="https://unpkg.com/vue@next"></sc
2021-10-29 10:04:47
50
原创 这个在项目里，setup不知道怎么摆
<template> <div id="app"> <button type="button" @click="increment">count值：{{ state.count }}</button> </div></template><script>export default {//name: 'HelloWorld',app.component('HelloWorld'),{ prop
2021-10-29 09:53:16
52
原创 Uncaught RangeError: Maximum call stack size exceeded
Uncaught RangeError: Maximum call stack size exceeded at assignValue (utils.js?c532:276) at forEach (utils.js?c532:251) at merge (utils.js?c532:289) at assignValue (utils.js?c532:280) at forEach (utils.js?c532:251) at merge (utils.j
2021-10-28 11:35:11
448
原创 Uncaught RangeError: Maximum call stack size exceeded
Uncaught RangeError: Maximum call stack size exceeded at merge (utils.js?c532:274) at assignValue (utils.js?c532:280) at forEach (utils.js?c532:251) at merge (utils.js?c532:289) at assignValue (utils.js?c532:280) at forEach (utils.j
2021-10-28 09:35:17
436
原创 axios的安装：npm install axios vue-axios
lianxi01 % yarn add axios --saveyarn add v1.22.10warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsyn.
2021-10-28 09:17:54
3064
原创 错误的BooksNew.vue
<template> <h3>新书上市</h3> <div> <p v-for="book in books" :key="book.id"> {{ book.title }}</p> </div></template><script>export default { data() { boo
2021-10-27 11:52:16
47
原创 试着写新书上市组件
看有什么困难第一步，写新书上市h3字成功，路由成功。新建了换一个BookNews.vue文件，而后又在App.vue里添加上了这个文件，上头要渲染处和下头组件引入处都添加了。
2021-10-27 11:24:35
58
原创 绑定html class，给v-bind:class传递一个对象，以动态地切换class
<template> <div id="app"> <div v-bind:class="{ active: isActive }">Java无难事</div> </div></template><script>export default { name: 'HelloWorld', data() { return { isActive: true } }
2021-10-27 11:19:50
135
原创 bug: Uncaught RangeError: Maximum call stack size exceeded
<template> <div id="app"> <hello-world class="baz"></hello-world> </div></template><script>export default { name: 'HelloWorld', template: ` <p :class="$attrs.class">Hi!</p>
2021-10-27 10:51:08
64
原创 v-for后面的key的用法，举两个例子
官网的说法：keyhttps://cn.vuejs.org/v2/api/#key一般的用法习惯：<ul> <li v-for="item in items" :key="item.id">...</li></ul> …v-for=“x in xs”:key=“x.id”
2021-10-27 10:38:33
235
原创 内联样式的数组语法，对页面边框和背景两个的约定
<template> <div id="app"> <div v-bind:style="[baseStyles, moreStyles]">《Java无难事》</div> </div></template><script>export default { name: 'HelloWorld', data() { return { baseStyles: {
2021-10-27 10:14:45
79
原创 什么叫内联样式，有什么功能？
style是它的标志吗？《java无难事》这个就是定义，绑定了一个样式，对象中，数据属性中定义了这个文字是红色，以及字的大小。与别的非内联样式有什么区别？<template> <div id="app"> <div v-bind:style="styleObject">《Java无难事》</div> </div></template><script>export default { name
2021-10-27 09:40:27
460
原创 在项目里实现单文件的功能，只需要改一下HelloWorld.vue的内容即可
HelloWorld.vue<template> <div id="app"> <div v-bind:style="styleObject">《Java无难事》</div> </div></template><script>export default { name: 'HelloWorld', data() { return { styleObject: {
2021-10-27 09:38:29
77
原创 最后成功了，router，罪魁祸首是没有views/home这段
找半天import { createRouter, createWebHashHistory } from 'vue-router'import Home from '@/views/Home'const router = createRouter({ history: createWebHashHistory(), routes: [ { path: '/', component: Home },
2021-10-26 13:19:45
136
原创 路由又整不明白了
Failed to compile with 1 error 上午11:52:24 error in ./src/router/index.jsModule Error (from ./node_modules/eslint-loader/index.js):/Users/ivyone/gu
2021-10-26 11:53:20
58
原创 自己写标签页组件遇到的错误问题
Failed to compile with 1 error 上午10:53:30 error in ./src/components/BookTabComponent.vueModule Error (from ./node_modules/eslint-loader/index.js):
2021-10-26 10:57:43
278
原创 BookTabComponent.vue的写法
错误：<template> <div class="tabComponent"> <button v-for="tab in tabs" :key="" @click= </button> </div></template><script>export default { name: 'TabComponent', props: {
2021-10-26 10:42:35
58
原创 还需要配上App.vue的修改才行
<template> <img alt="Vue logo" src="./assets/logo.png"> <Home/></template><script>import Home from './views/Home.vue'export default { name: 'App', components: { Home }}</script><style>#app
2021-10-26 10:13:05
154
原创 Home.vue的代码
错误的<template> </template><script>import router from routerexport default { }</script>正确的：<template> <div>主页面</div></template><script>//import router from routerexport defaul
2021-10-26 10:10:44
185
原创 element-plus: Failed to compile with 4 errors
Failed to compile with 4 errors 下午12:09:46These dependencies were not found:* element-plus/lib/el-pagination in ./src/main.js* element-plus/lib/t
2021-10-25 12:15:56
596
原创 这又是啥？[babel-plugin-component] If you are using bothon-demand and importing all, make sure to invoke
Failed to compile with 1 error 上午11:37:30 error in ./src/main.jsSyntax Error: Error: /Users/ivyone/guagua20/hami076/src/main.js: [babel-plugin-c
2021-10-25 11:39:09
2955
1
原创 装了按需引入以后，npm install babel-plugin-component -D，出现3个bug
ERROR Failed to compile with 3 errors 上午11:30:56These dependencies were not found:* element-plus/lib/el-pagination in ./src/main.js* element-pl.
2021-10-25 11:32:32
793
原创 This dependency was not found: * element-plus/lib/theme-chalk/index.css in ./src/main.js
Failed to compile with 1 error 上午11:16:33This dependency was not found:* element-plus/lib/theme-chalk/index.css in ./src/main.jsTo install it,
2021-10-25 11:17:59
1375
1
原创 Uncaught TypeError: Cannot read properties of undefined (reading ‘state‘)
Uncaught TypeError: Cannot read properties of undefined (reading ‘state’)为啥
2021-10-24 12:36:39
3314
4
原创 main.js的错误示范与正确示范
import { createApp } from 'vue'import App from './App.vue'import axios from 'axios'import VueAxios from 'vue-axios'import index from 'router'createApp(App).mount('#app')createApp(App).use(axios, VueAxios).mount('app')正确import { createApp } from
2021-10-24 12:36:29
370
原创 更改了main.js的内容，又变成这样了
Failed to compile with 2 errors 下午12:11:02These dependencies were not found:element-plus/lib/theme-chalk/index.css in ./src/main.jselement-ui/lib/
2021-10-22 12:13:43
400
原创 element-plus按全局引入解决element-plus的问题以后，又出现了新的问题。
Failed to compile with 1 error 下午12:00:14 error in ./src/main.jsSyntax Error: Error: /user……/main.js: [babel-plugin-component] If you are using
2021-10-22 12:02:44
1958
1
原创 为啥安装element-plus了，还是出现3个关于element-plus的bug？
% yarn add element-plus yarn add v1.22.10warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caus
2021-10-22 11:58:09
1123
3
原创 现在是Failed to compile with 3 errors：element-plus/lib/el-pagination
Failed to compile with 3 errors 上午11:49:18These dependencies were not found:* element-plus/lib/el-pagination in ./src/main.js* element-plus/lib/t
2021-10-22 11:50:23
952
原创 Failed to compile with 4 errors: element-plus/lib/el-pagination
Failed to compile with 4 errors 上午11:31:34These dependencies were not found:* element-plus/lib/el-pagination in ./src/main.js* element-plus/lib/t
2021-10-22 11:49:31
487
原创 Error: Cannot find module ‘babel-plugin-component‘的bug终于解决了：装上它，命令为：npm i babel-plugin-component -D
% npm i babel-plugin-component -Dadded 3 packages in 4s92 packages are looking for funding run `npm fund` for details % yarn serveyarn run v1.22.10warning ../package.json: No license field$ vue-cli-service serve INFO Starting development server
2021-10-22 10:38:31
1244
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人