nginx 部署多个前端vue项目的3种方式,一篇文章搞定

nginx 部署多个前端vue项目的3种方式,一篇文章搞定,第1张

首先我们看一下nginxconf配置文件

为了方便管理,在/usr/local/nginx/confd/ 创建自己的conf配置文件。没有confd目录,直接mkdir 创建confd

conf 详细可参考:

这种方式只需要开放80端口,然后访问二级域名。

这种方式的好处是只有一个server ,而且不需要二级域名、用路径location就能实现。

但是这种方式的一个缺点,就是vue项目前端需要改配置。修改地方如下:

react 配置请参考: >

目前只能想到这些了,对了,还有事件总线这类的就不考虑了。

最基础的方式,适用于 父组件和子组件之间的直接传值,多用于基础控件,比如input、el-input、el-select这类。

比较基础不多介绍了。

老牌的状态管理方式,各种组件之间各种传值,好吧专业术语叫做状态管理。

使用方法呢,其实就是一层窗户纸,捅破了大家就都知道了,这里不介绍了,可以看我的文集:

>

一、 vue里页面之间传参通过router-link

二、vue里获取接口数据

和js原生对比不然发现有不同的地方,这里是对接口进行了一些封装

三、 结合数组函数map实现二级联动

四、 结合数组函数push、indexOf、splice增删输入框

五、渲染列表

列表里大部分用的都是input标签,然后渲染方式就是 绑定v-model双向绑定更改数据

六、父子通信

查看vuejs是否安装成功的具体步骤如下:

1、首先打开电脑桌面左下角开始菜单栏中的“运行”。

2、然后在d出来的窗口中点击输入“cmd”,鼠标左键点击下方的“确定”。

3、然后在d出来的窗口中点击输入命令“vue -v”,回车确定,d出vue相关命令的提示,就说明vue是成功安装的了。

首先

vue的点击事件

是用

@click

=

“clickfun()”

属性

在html中绑定的,

在点击的函数中

添加$event

参数就可以

比如

<button

@click

=

“clickfun($event)”>点击</button>

methods:

{

clickfun(e)

{

//

etarget

是你当前点击的元素

//

ecurrentTarget

是你绑定事件的元素

}

},

以上这篇vue

的点击事件获取当前点击的元素方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

您可能感兴趣的文章:vue如何获取点击事件源的方法VUE中v-on:click事件中获取当前dom元素的代码vue获取当前点击的元素并传值的实例vue获取dom元素注意事项在Vue组件中获取全局的点击事件方法

用vue router如何获得当前页面的路由的方法如下:

路由器将自渲染对应的组件以及更新路由信息:

其中<router-view>可以传递props,支持v-ref,同时也可以使用v-transition和transition-mode来获得场景切换效果,被渲染的组件将注册到父级组件的this$对象上。

路由对象和路由匹配:

路由对象,即$router会被注入每个组件中,可以利用它进行一些信息的获取。

如属性 说明:

$routepath 当前路由对象的路径,如'/vi

$routequery 请求参数,如/foouser=1获取到queryuser = 1

$routerouter 所属路由器以及所属组件信息

$routematched 数组,包含当前匹配的路径中所包含的所有片段所对应的配置参数对象。

$routename 当前路径名字

当然,你也可以在自己定义路由规则(map)的时候自定义字段,用以特殊目的。

这里只是做了一些简单的介绍,最后,更多高级用法请参考官方文档。

以上就是关于nginx 部署多个前端vue项目的3种方式,一篇文章搞定全部的内容,包括:nginx 部署多个前端vue项目的3种方式,一篇文章搞定、从idea的local启动不了vue、Vue3组件(18)组件间传值/共享的方法的汇总等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/9325912.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-04-27
下一篇2023-04-27

发表评论

登录后才能评论

评论列表(0条)

    保存