草庐IT

Vue-Instant

全部标签

VUE ui工程创建

打开vue界面服务cmd命令,输入vueui,可以直接在浏览器输入:http://localhost:8000/注意:运行的时候不能关闭cmd窗口,不然就停止服务了创建vue工程在仪表盘里点击自定义,添加“运行任务”控件,选择serve,点击运行按钮即可启动工程浏览器输入:http://localhost:8080/即可访问该工程服务

vue2 vue-router引入使用详解

vue2vue-router使用详解1介绍2VueRouter的使用2.1安装2.2项目引入使用2.2.1创建路由文件2.2.2main.ts引入2.2.3App.vue配置2.2.4整体目录结构2.4使用方法2.4.1使用router-view进行页面视图切换2.4.2使用router-link进行页面跳转2.4.3路由重定向2.4.4路由传参2.5.5路由守卫3其他1介绍Vue很适合用来构建单页面应用。对于大多数此类应用,都推荐使用官方支持的VueRouter;在单页面应用(Single-pageapplication)中,客户端的JavaScript可以拦截页面的跳转请求,动态获取新的数

Vue 3.0源码系列之ref、toRef、toRefs

大家好,我是初心,本篇是源码系列之ref、toRef、toRefs本篇也是我坚持原创文章的第04期文章,如有错误,欢迎指正👏🏻在讨论原始值的响应式方案,先看看原始值有哪些吧,目前阶段原始值分别是Boolean,Number,BigInt,String,Symbol,undefined,null前言一、引入ref的概念由于proxy代理目标必须是非原始值,所以我们没有任何手段拦截对原始值的操作,例如:letname='luanshu';//无法拦截对值的修改name='巧君';对于ref是一个函数创建响应式,在Vue2.0中已经规范了架子,采用optionsdata对象形式,所以不需要考虑这个原

如何关闭vue项目中的[eslint]校验

要关闭Vue项目中的ESLint校验,可以按照以下步骤进行操作:打开项目根目录下的.eslintrc.js文件(如果没有该文件,则创建一个新的)。在文件中添加以下代码:module.exports={//其他配置项...rules:{//禁用所有规则'no-unused-vars':'off',//其他规则可以根据需要启用或禁用},};保存文件并关闭。重新启动Vue项目,ESLint校验应该已经关闭了。通过将'no-unused-vars'规则设置为'off',你可以禁用ESLint对未使用变量的校验。如果你还想禁用其他规则,可以在rules对象中添加相应的规则和设置。请注意,关闭ESLint

vue2项目 使用海康视频h5player@2.0版本

一、下载开发包    我们需要去海康官网下载h5player@2.0版本的一些用到的文件二、引入开发包    下载之后我们把下载的文件打开把bin里的文件移动到pubilc文件里,可以自己单独建一个文件放在里面注意:一定要放在vue中的public文件夹中否则会报错三、引用下载的文件    之后我们就需要在pubilc里的index.html文件里引用四、封装h5player的dome    再然后就是我自己百度修改之后封装的代码文件名字h5HkVideo.vueexportdefault{name:"h5HkVideo",props:{preUrl:{type:String,},},data

vue中获取复选框是否被选中的值、如何用JavaScript判断复选框是否被选中

一、方法介绍         第一种方法:通过获取dom元素,getElementById、querySelector、getElementsByName、querySelectorAll(需要遍历,例如:for循环)        第二种是用v-model在input复选框上绑定一个变量,通过双向绑定的特性来判断复选框是否被选中。(推荐使用)二、演示:第一种:被选中输出true,否则为falsedocument.getElementById()html:js:letcheckbox=document.getElementById("myCheckbox");console.log(check

记录--Vue3问题:如何实现组件拖拽实时预览功能?

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助1.需求分析实现一个CMS内容管理系统,在后台进行内容编辑,在官网更新展示内容。关于后台的编辑功能,大致分为两部分:组件拖拽预览、组件内容编辑实时预览。对于组件拖拽预览,用户可以在含有各种功能组件的列表中,选择需要的组件进行拖拽。将组件拖拽到预览画布中后,可以在画布中预览组件的内容。对于组件内容编辑实时预览,用户可以点击编辑按钮,显示对应组件的内容编辑信息。当修改组件内容时,在画布中可以实时预览组件的变化。2.实现步骤2.1关于拖拽组件库的选择关于拖拽组件库,在github上有很多,最热门的当属vuedraggable这个库。它基于S

servlet+JSP与SpringBoot+Vue项目交互——servlet请求SpringBoot接口

问题servlet+JSP与SpringBoot+Vue项目交互——servlet请求SpringBoot接口详细问题笔者前一段时间开发一个项目,使用的技术框架是servlet+JSP,现阶段开发的项目技术框架为SpringBoot+Vue,笔者现在需要输入servlet+JSP请求SpringBoot接口,获取接口相应,如何实现解决方案1、若读者使用的是Maven作为构建工具,您可以在项目的pom.xml文件中添加以下依赖项:Copycodedependencies>dependency>groupId>com.fasterxml.jackson.coregroupId>artifactId

VUE3使用JSON编辑器

1、先看看效果图,可以自行选择展示效果2、这是我在vue3项目中使用的JSON编辑器,首先引入第三方插件npminstalljson-editor-vue3yarnaddjson-editor-vue33、引入到项目中//导入模块importJsonEditorVuefrom'json-editor-vue3'//注册组件components:{JsonEditorVue},4、一般后端返回的是会将JSON转为String形式,我们传给后端也是通过这种形式,就可以通过后端拿到的数据进行JSON与String之间转换//后端拿到的数据configValue:"{\"isBigTree\":tru

VUE子组件如何改变父组件传来的值,以及VUE子组件如何修改父组件的值,以及父组件修改子组件的值

一)子组件修改父组件传来的值:父组件传递给我一个名为deptName数据,但是现在我要在子组件中修改它的值并且实时更新页面,直接this.deptName是不能直接修改他的值的,所以我采用了使用一个中间变量来接受的方式对齐进行修改: 1、父组件:2、子组件:在data中定义一个变量接受,然后将其赋值为this.deptName即可,之后就可以正常修改data的方法对齐进行修改了。二)子组件修改父组件中的值:VUE2案例:我要删除一个值,这个逻辑是在子组件进行的,所以父组件的数组中值没有少但是数据库的值已经改变了,只有下次刷新页面的时候才能看到效果,这样体验非常不好,此时我们需要用子组件来修改父