2301_79420857的博客

在使用vue-next-admin这个框架的时候，将项目打包上传到宝塔上过后，也配置反向代理了，但是打开就是空白页面，并且报错。在项目中搜到了这个名字，env文件夹里我注释了这段代码过后，又重新打包上传了一下宝塔，项目就可以正常显示了。注意：如果路径错误，可以根据实际情况修改路径。确保资源文件存在：检查资源文件是否存在于指定的路径中。这个文件路径，我没有这个文件为这个，所以我在项目中搜了一下这个名字。翻译为：加载资源失败：服务器响应404（未找到）状态。可能就是因为图片路径错误，看了后面路径，它多了一个。

在上面的示例中，我们首先声明了一个 Animal 类，包含了一个构造函数和一个 speak 方法。在子类的构造函数中，通过 super() 调用父类的构造函数，并可以在子类中重写父类的方法。需要注意的是，在子类的构造函数中必须先调用 super()，这样才能正确地初始化父类的属性。另外，如果子类定义了与父类同名的方法，在子类实例调用该方法时会优先调用子类的方法而不是父类的方法（即发生方法覆盖）。通过继承，子类可以复用父类的属性和方法，并且可以添加自己特有的属性和方法。这样可以提高代码的可维护性和可扩展性。

注意，如果想要根据每个元素的不同条件进行渲染，可以在。的父元素上，这样可以根据每个元素的不同条件进行渲染。这意味着在同一个元素上使用。将首先被解析，然后是。

在Vue中，常用的指令有v-bind、v-on、v-for、v-if、v-show等。自定义指令可以通过Vue.directive()方法来创建。以上代码示例中，v-highlight是自定义的指令，它会将元素的背景颜色设置为指令的参数值。v-show：用于根据条件展示或隐藏元素。v-bind：用于动态绑定HTML属性。v-on：用于监听DOM事件。v-for：用于循环渲染列表。v-if：用于条件渲染。

一般在使用 moment 后遇到的问题，这通常是意味着传递给 moment 的日期字符串格式与 moment 所期望的格式不匹配（通俗来讲就是你传递的格式与你数据的格式不一致而导致的）又或者说是日期字符串它本身就是无效的。

通常， RangePicker 组件期望接收一个数组作为值，这个数组包含两个元素:开始时间和结束时间(都是 moment对象或者可以被 moment 解析的字符串格式)。具体报错我下一篇博客会写到，这些都是我在写项目中遇到的问题，虽然算不上什么大问题，但是在制作项目时也是印象深刻，为了避免以后再因为忘记或者粗心遇到此类问题，就先记录下来！这个编辑事件绑定后，为了将日期数据会先到RangePicker组件，需要确保itemDate字端被正确设置，其格式应该和itemDate组件的格式是一样的。

在上述代码中，我们定义了一个名为withBackgroundColor的高阶组件函数。这样，WrappedComponent就具有了额外的功能，即设置背景颜色，并将其传递给被包装的MyComponent组件。它本质上是一个接收一个组件作为参数，并返回一个新的包装组件的函数。在高阶组件内部，我们返回一个匿名类组件，该组件会渲染一个带有指定背景颜色的div元素，并将传递给高阶组件的props传递给被包装的组件。然后，我们定义了一个普通的组件MyComponent，它接收一个name属性并渲染相应的内容。

beforeEach(to, from, next)：在路由切换开始时被调用，可以用来进行全局的导航守卫，如权限验证等。调用 next() 继续导航，调用 next(false) 中止导航，调用 next('/path') 跳转到新的路径。在 Vue 中，路由的钩子函数可以用来在导航过程中执行一些操作，比如进行权限验证、页面加载前后的处理等。beforeResolve(to, from, next)：在导航被确认之前和所有组件内守卫和异步路由组件被解析之后调用。详细的用法和更多选项可以查阅。

在上面的示例中，我们定义了一个 selectedFruit 数据，用于保存用户选择的水果。在 HTML 模板中，我们使用了 <select> 元素，并通过 v-model="selectedFruit" 将用户的选择与 selectedFruit 数据进行了双向绑定。当用户进行选择时，Vue 会自动更新 selectedFruit 的值，从而实现了赋值的功能。在 HTML 模板中使用 <select> 元素，并通过 v-model 指令将用户的选择与定义的数据进行绑定。

我安装这个框架选择安装complate（完整版），安装过后启动发现是白屏，然后旁边还有报错。把最顶部config文件夹里的rourte.ts路由中的register下面的。给注释掉或者删除然后就ok了。

我在选择过后回车它会出现一串红色的英文句子‘No change to package... ...’这样的我们直接安装依赖即可。出现这样的模式就是创建并且初始化好了，然后通过打开命令npm statr运行就好了。下面那很大的一个报错我每次创建的时候都踩坑，注意我是的文件路径是在。等待它运行完之后会出现这个选项（简单/复杂）进行选择然后回车就好。，安装依赖要在你通过以上操作创建的文件里安装，所以要格外小心。在此我前进了一个文件后输入命令安装依赖了然后就正常运行了。中，这个是我要放创建的文件的一个文件。

'cross-env' 不是内部或外部命令，也不是可运行的程序 或批处理文件。在使用ANT DESIGN PRO这个react框架时出现了。

总的来说，setup语法糖使得Vue组件的开发更加高效和灵活，同时提供更好的类型检查和性能优化。

在 Vue.js 中，单页面应用 (SPA) 是一种 Web 应用程序，它在加载初始页面后，通过动态地更新页面的内容而不是通过重新加载整个页面来实现用户导航和交互。组件通信：通过 props 和 events 实现组件之间的通信，父组件可以向子组件传递数据，子组件可以通过 events 向父组件发送消息。总的来说，Vue.js 提供了丰富的工具和功能来帮助开发者构建高效的单页面应用，同时也提供了良好的文档和社区支持，使得开发过程更加顺畅。这样可以使代码更加清晰，易于维护和复用。

在响应式编程中，数据的变化会自动地传播给依赖于该数据的其他部分，从而实现数据的自动更新和同步。Reactive 编程通常使用观察者模式或者流式编程来实现，比如在 Vue.js 中就使用了响应式数据和计算属性来实现数据的自动更新。在编程中，我们可以通过引用来访问、修改特定的数据。Ref 通常用于管理和操作数据的引用，比如在 React 中使用 Ref 来访问和操作 DOM 元素。因此，Ref 主要是对数据的引用进行操作，而 Reactive 则是一种编程范式，强调数据之间的依赖关系和自动更新。

综上所述，Webpack适用于复杂的项目和需要更多配置和插件支持的场景，而Vite则适用于快速原型开发、小型项目或者对构建速度要求较高的场景。内置了一个基于原生 ES 模块的开发服务器，它使用浏览器原生的模块解析，无需打包，可以直接运行源代码，从而提供了更快的开发环境。采用了即时编译的方式，通过利用现代浏览器的原生 ES 模块支持，可以实现秒级启动和热更新的开发体验，因此在开发过程中更快。的配置更为简单，它的默认配置已经足够满足大多数项目的需求，无需过多的配置。相对较新，生态系统和插件支持相对较少。

至此，你已经成功从零开始创建了一个Vue项目，并可以开始开发自己的Vue应用了。如果需要更多定制化的配置，可以在创建项目时选择手动配置，并根据需求进行配置。在浏览器中访问 http://localhost:8080/（默认端口可能会有所不同），即可看到Vue项目的默认页面。在创建过程中，Vue CLI 会询问你关于项目配置的一些选项，例如选择手动配置或使用预设配置等。下载安装Node.js： 在Node.js官网下载适合你操作系统的Node.js安装包，并按照提示进行安装。：创建新的Vue项目。

引入 CSS：主要用于引入外部样式表文件，如 <link rel="stylesheet" href="styles.css">。加载顺序：@import 引入的样式表会在整个页面加载完成后才开始加载，可能会造成页面加载速度较慢，因为它会阻塞其他资源的加载。一般来说，推荐使用 <link> 标签来引入外部样式表文件，因为它具有更广泛的用途并且能够并行加载资源，有助于提高页面加载性能。<link> 具有更广泛的用途，可以引入各种类型的外部资源，而 @import 主要用于引入外部样式表。

同源策略是浏览器提供的一个安全功能，它限制了从同一个源加载的文档或脚本如何与来自另一个源的资源进行交互。3.为了防止恶意网站在自已网站有访问其他网站的权利，以免通过cookie免登，拿到数据。出现跨域的根本原因 浏览器的同源策略不允许非同源的 URL 之间进行资源的交互。跨域指的是两个 URL 的协议、域名、端口只要其中一个不一致，就会形成跨域。首先我们要知道什么是同源，当两个页面的端口，协议，域名都相等的时候这才叫。2.为了防止恶意网站iframe其他网站的时候，获取数据。

在js的学习中，为元素添加事件是非常常见的。那么，下面我带大家了解一下js中移除事件的两种方法。