vue
小小码农呀
What are you waiting for
展开
-
vue在多页面情况下在子页面中进行点击页面部分被跳转
通常我们在实现了vue多页面之后都会遇到一个问题,那就是在多页面中在进行页面跳转还是像之前的单页面一样配置路由吗?答案是:NO!我们在进行多页面跳转之后在子页面中进行跳转不使用路由,我们只需要在点击跳转出来的多页面中进行配置即可:代码:在红框中的代码才是本次需要的代码代码:<template> <div id="app"> <ul> <li v-for="(tab,index) in tabs" @click="toggle(ind原创 2020-08-02 21:22:04 · 2315 阅读 · 0 评论 -
vue 多页面跳转配置与实现(看了就会,一步一步作)
通常我们在vue框架中制作页面都是单页面操作,如果我们想要进行多页面操作,比如实现显示不同ico图标都需要进行多页面操作,下面我们一起来实现实现多页面跳转需要进行页面的移动和配置1.初始化项目,进入项目根目录下,我们会看一般性的文档配置如下:我们需要修改的是public文件夹和src文件夹,以及增加一个配置文件vue.config.js.在我们原本的项目中index.html、main.js和app.vue的位置是:1.index.html —> 在public文件夹下2.main.js原创 2020-08-02 20:54:49 · 12054 阅读 · 3 评论 -
vue css下拉菜单
<div class="dropdown"> <span>Mouse over me</span> <div class="dropdown-content"> <p>Hello World!</p> </div></div><style> .dropdown { position: relative; display: i原创 2020-08-02 18:54:50 · 443 阅读 · 0 评论 -
Vue router 类似tab切换使用
在上一次的文章中我们知道了如何安装以及Vue router的基本使用,这次我们来聊聊Vue router的切换如何实现1.首先我们需要在上一次创建好的项目中新建几个待切换的.vue文件2.然后我们需要在router.js里面添加代码// 组件import Text1 from './components/Text1'import Text2 from './components/Text2'import Text3 from './components/Text3'3.同在router原创 2020-07-24 22:35:22 · 354 阅读 · 0 评论 -
Vue router在Visual Studio Code中的安装与使用
Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌。包含的功能有:嵌套的路由/视图表模块化的、基于组件的路由配置路由参数、查询、通配符基于 Vue.js 过渡系统的视图过渡效果细粒度的导航控制带有自动激活的 CSS class 的链接HTML5 历史模式或 hash 模式,在 IE9 中自动降级自定义的滚动条行为1.安装Vue router1.先新建一个vue,把他拉进Visual Studio Code在Visu原创 2020-07-24 22:00:59 · 3419 阅读 · 0 评论 -
vue中,组件父传子,子传父
父传子子组件父组件效果第二种父传子父组件子组件注意:可以只导入一次组件二.子传父父组件子组件原创 2020-07-24 13:33:53 · 140 阅读 · 0 评论 -
vue基础知识以及声明式数据渲染,条件与循环,用户信息输入,双向绑定等简单编写
一,声明式数据渲染,条件与循环,用户信息输入,双向绑定等简单编写1、{{ message }}2、v-if3、v-for4、v-on:click5、v-model1.声明式数据渲染注意:需要注意的是在vue的数据渲染中的数组时必须要有反回值。这就出现了2.v-if条件渲染3.v-for循环4.v-on:click处理绑定点击这里做了一个点击反转函数两种方法:采用第二种:效果:5.v-model处理用户输入:一。生命周期beforeCreate创建原创 2020-07-22 21:39:46 · 197 阅读 · 0 评论 -
如何将vue.js项目导入Visual Studio Code进行编辑
当vue 在Visual Studio Code里面运行时我们需要把整个项目拖拽到里面2.我们打开终端3.如果我们直接在里面属于yarn serve启动会报错,这时我们首先在1.右键开始菜单找到Windos PowerShell,直接搜也行2.打开之后执行set-ExecutionPolicy RemoteSigned命令,输入A即可,如下图所示输入A回车即可4.回到Visual Studio Code先把这个注释掉,不用HelloWorld这个组件,然后在终端输入yarn ser原创 2020-07-22 20:18:16 · 2722 阅读 · 0 评论 -
win10安装GIT,node.js ,cnpm,yarn,vue,vue脚手架的完整安装
一:在安装vue的时候要先安装node.js;安装步骤:1.在安装之前我们首先安装一个GIT工具,(就是cmd差不多但是好用)https://git-scm.com/安装完成之后在桌面右键出现**2.node.js安装**:(推荐安装长期稳定版本12.18.。。)node官网:https://nodejs.org/en/进入点击安装完成在git工具中输入node -v检查是否成功,成功会出现版本号检验npm是否存在:npm -v3.cnpm安装安装成功后接下来安装原创 2020-07-22 19:09:48 · 627 阅读 · 0 评论 -
w10系统命令界面node,yarn,cnpm,vue安装
1.安装GET工具(类似于cmd(好用))2.安装node.js(检查安装:node -v,)3.检查npm(再node里面存在) :npm4.cnpm安装:https://developer.aliyun.com/mirror/NPM?from=tnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org(检验cnpm:cnpm -v )5.yarn安装:npm install -g yarn(检验:yarn -v)6.原创 2020-06-21 19:54:53 · 381 阅读 · 0 评论