首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Vue3项目Build后部署在Nginx上F5刷新页面空白或404

环境 vue-cli 5.x vue-router 4.x Nginx 综述 使用Vue3项目Vue-router4开发完毕后项目Build打包部署线上环境后,首页能正常访问菜单内点击切换也没有问题...,但当你刷新页面后,则出现 404 Not Found,故在此记录一下解决办法 解决思路 在与chatGPT进行深刻激烈的探讨后,确定了是Nginx的问题,根据chatGPT的引导进行配置依旧无法解决...,刷新页面时访问的资源在服务端找不到,因为此时vue-router设置路由地址被当作url地址,此时的地址路径肯定不是真实存在的,所以出现404现象。...之所以出现上面的现象,是因为在nginx配置的根目录/www/wwwroot/dist下面压根没有'XXX/xxx/xxx'这个真实资源存在,这些访问资源都是在js里渲染的。...解决问题 在服务端nginx配置里添加vue-route的跳转设置,正确配置如下: server { listen 80; server_name www.vvhan.com;

2.9K40
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    速读原著-Android应用开发入门教程(基本控件的使用)

    在本例的布局文件中,使用了 android:text 一个属性来定义在 Button 上面显示的文本,根据帮助,这其实是 TextView 中的一个 XML 属性,在这里被 Button 类继承使用,除了在布局文件中指定...ImageButton 和 ImageView 的区别也仅在于外观和使用方式上,主要的图像设置方法和 ImageButton 中的一样。...事实上,ImageButton 除了在外观上表现成一个按钮的状态,其他方面和 ImageView 基本一样。...() // 获得第二个进度条的进度 ProgressBar 在使用的时候,要注意最大值和当前值的关系,在 UI 上所呈现的状态,其实是当前值和最大值的一个比例。...在界面中包含了:Button(普通按钮)、EditText(可编辑文本区域)CheckBox(复选框)、RadioGroup(单选按钮组)、ToggleButton(开关按钮)、TextView(文本区域

    1.4K10

    Android开发笔记(三十七)按钮类控件

    Button与ImageButton Button是文本按钮(继承自TextView),而ImageButton是图像按钮(继承自ImageView)。...两者之间的区别在于: 1、Button即可显示文本也可显示图形(通过设置背景图),而ImageButton只能显示图形不能显示文本; 2、Button可在文本周围区域显示小图,而ImageButton...无法在某个区域显示小图; 3、ImageButton上的图像可按比例进行拉伸,而Button上的大图会拉伸变形(因为背景图无法按比例拉伸); 从上面可以看出,Button的适应面更广,所以实际开发中基本使用...其实Switch就是个特殊UI的CheckBox,在选中与取消选中时,可展现的界面元素要比复选框要丰富些。 xml布局上新加的属性设置: textOn : 指定右侧开启时候的文本。...代码中新加的方法: setTextOn : 设置右侧开启时候的文本。 setTextOff : 设置左侧关闭时候的文本。

    1.6K30

    JAVA学习Swing章节标签JLabel中图标的使用

    中显示文本或提示信息的方法是使用标签,它支持文本字符串和图标 * 重点是标签含有文本字符串和图标 * * 2:标签可以显示一行只读文本,一个图像或带图像的文本,它并不能产生任何类型的事件 *...只是简单的显示文本和图片,但是可以使用标签的特性指定标签上文本的对齐方式 * 重点是只是简单的显示文本和图片 * * 3:JLabel标签的构造方法,带图标,并且设置图标水平对齐方式,带文字,并设置文字的水平对齐方式...main(String[] args) { DrawIcon icon=new DrawIcon(150,150);//初始化并且向构造方法传值 //创建一个标签,并设置标签上的文字在标签正中间...* 调用setImage(Image image)方法来操作 * 第二直接从图片源创建图表 * 第三除了可以直接从图片源创建图表之外,还可以为这个图标添加简短的描述 * 第四利用位于计算机网络上的图像文件创建图标...Icon对象 jl.setIcon(icon);//为标签设置图片 //设置文字放置在标签中间 jl.setHorizontalAlignment

    1.9K60

    .Net语言 APP开发平台——Smobiler学习日志:如何快速实现类似于微信的悬浮显示二维码效果

    最前面的话:Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台,也许比Xamarin更方便 样式一 一、目标样式 我们要实现上图中的效果,需要如下的操作: 1.从工具栏上的“Smobiler...Components”拖动一个LayoutDialog控件和一个ImageButton控件到窗体界面上 2.修改LayoutDialog控件的属性 a.Layout属性 新建MobileForm项,...命名为MessageShow,如图1; 设置弹出框布局,绑定新建的窗体MessageShow,如图2; 图1 图2 3.ImageButton的Click事件 VB: Private Sub...imageButton1_Click(sender As Object, e As EventArgs)Handles imageButton1.Click layoutDialog1....Show(new MessageShow()) End Sub C#: private void imageButton1_Click(object sender, EventArgs e)

    66740

    按钮和复选框控件

    android:state_enabled 设置触摸或点击事件是否可用状态,一般只在false时设置该属性,表示不可用状态。...这个是当一个组件是否能处理touch或click事件的时候的状态,如果要对组件能否响应事件设置不同背景的时候,就要靠这个属性了. android:state_pressed 设置是否按压状态,一般在true...或者一个listView等里面一个item被选择的时候的状态,因此这个属性设置在一般的组件上面是没有用的,只有设置有作为tab或item的布局里面的项时,这个属才起作用. android:state_checked...这个是当一个组件在可以checked或不可以checked的时候的状态,现在较常见的,能够checkable的组件有,单选项和多选项,所以这个属性只有设置在像这类组件上面才有作用的。...并不是TextView的之类,而是ImageView的之类,因此并没有android:text属性,如果要想在ImageButton上添加文字,可以自定义控件,重写onDraw方法。

    1.2K20

    山川湖海 - Android无障碍功能优化实践

    在 Android 上,对于这些用户用户而言,主要通过系统附带的屏幕阅读器 TalkBack 来进行控制设备。...但更多的是因为这和 Android原生UI 在 无障碍 上根深蒂固的 开发模式 有关系,即 非[显式] 。...对于 Android原生UI 而言,如果应用主要使用的是 [系统组件],那么在无障碍下,体验一般不会太差,比如常见的 Text , Button 。在无障碍下都会读取相应的显示文本信息作为描述。...在无障碍下点击时,则只会读取描述,而使用了 ImageButton 或者 Button 的在无障碍模式下会被读作xx [按钮] ,相比起来,后者更象征着这具有一个行为作用,而前者仅仅像一个普通文本,这对视障用户而言...无障碍功能扫描仪主要用于对当前屏幕上所有的 View 进行扫描,并给出建议,主要包括以下方面: 内容标签 触目目标的尺寸 是否存在可点按的内容 文本和图片的对比度 我们可以用其作为一个参考作用来使用。

    94120

    Page.ClientScript.RegisterStartupScript() 方法「建议收藏」

    先前的翻转按钮示例有一个问题,即当终端用户的鼠标置于按钮图像上时, 必须通过单独的请求从服务器检索翻转图像。...较好的翻转按钮情况是,按钮的翻转图像已经下载并存储到了浏览器的高速缓存中, 以便当终端用户将鼠标置于按钮上时, 会立即显示翻转图像。要完成该任务,我们必须构建一个 JavaScript 函数。...除了使用 RegisterClientScriptBlock 方法添加了 JavaScript 函数外, 我们还添加了一些额外的 JavaScript(只是为了增添点乐趣), 以便在终端用户将鼠标置于按钮上时文本会显示在浏览器的状态栏中...就此列举一例,以下是在页面加载到浏览器时,将焦点置于该页面上的一个文本框中的方法 – 使用利用了 RegisterStartupScript 方法的 Visual Basic: Page.ClientScript.RegisterStartupScript...时,就已生成了页面上的文本框, 并已将其放到了页面中,因此,此方法运行正常。

    2.1K20

    鸿蒙HarmonyOS应用开发-Column&Row组件

    交叉轴方向的对齐(alignItems)子组件在交叉轴方向上的对齐方式使用alignItems属性来设置。...Center(默认值):设置子组件在水平方向上居中对齐。End:设置子组件在水平方向上按照末端对齐。...Center(默认值):设置子组件在竖直方向上居中对齐。Bottom:设置子组件在竖直方向上居底部对齐。接口介绍接下来,我们介绍Column和Row容器的接口。...在此基础上,我们可以看到有部分内容在水平方向上由几个基础组件构成,例如页面中间的短信验证码登录与忘记密码以及页面最下方的其他方式登录,那么构建这些内容的时候,可以在Column组件中嵌套Row组件,继而在...两个文本组件展示的内容是按水平方向布局的,使用两端对齐的方式。

    37610

    山川湖海 - Android无障碍功能优化实践

    在 Android 上,对于这些用户用户而言,主要通过系统附带的屏幕阅读器 TalkBack 来进行控制设备。...但更多的是因为这和 Android原生UI 在 无障碍 上根深蒂固的 开发模式 有关系,即 非[显式] 。...对于 Android原生UI 而言,如果应用主要使用的是 [系统组件],那么在无障碍下,体验一般不会太差,比如常见的 Text , Button 。在无障碍下都会读取相应的显示文本信息作为描述。...在无障碍下点击时,则只会读取描述,而使用了 ImageButton 或者 Button 的在无障碍模式下会被读作xx [按钮] ,相比起来,后者更象征着这具有一个行为作用,而前者仅仅像一个普通文本,这对视障用户而言...无障碍功能扫描仪主要用于对当前屏幕上所有的 View 进行扫描,并给出建议,主要包括以下方面: 内容标签 触目目标的尺寸 是否存在可点按的内容 文本和图片的对比度 我们可以用其作为一个参考作用来使用。

    81321

    C002Android学习笔记-初级控件(二)

    一、简单控件 1、文本视图TextView 常用设置: ①设置文本内容: xml中——text;代码中——setText; ②设置文本颜色: xml中——textColor;代码中——setTextColor...; ③设置文本字体大小: xml中——textSize;代码中——setTextSize; ④设置文本风格,风格定义在res/styles.xml: xml中——textAppearance;代码中——...;代码中——setFocusableInTouchMode; 指定文本超过范围后的省略方式取值表: ①省略号在开头: xml中——start;TruncateAt中——START; ②省略号在中间: xml...ImageButton派生自ImageView,本质上就是一个带了按钮外观的图片; Button可以设置文字按钮,ImageButton可以设置图片按钮,那么图片加文字按钮呢?...:指定图形与文本的间距; 代码中的基本设置: setCompoundDrawables:设置文本周围的图形; setCompoundDrawablePadding:设置图形与文本的间距;

    7310

    .Net语言 APP开发平台——Smobiler学习日志:如何在手机上实现电子签名功能

    最前面的话:Smobiler是一个在VS环境中使用.Net语言来开发APP的开发平台,也许比Xamarin更方便 一、目标样式 ?...我们要实现上图中的效果,需要如下的操作: 1.从工具栏上的“Smobiler Components”拖动一个Signature控件和一个ImageButton控件到窗体界面上 ?...2.修改ImageButton的属性 a.BackColor属性 设置控件的背景色,将该属性设置为“128, 255, 128”,表示RGB颜色,如图1; b.BackColorAlpha属性 设置控件背景色透明度...,将该属性设置为“0”,即全透明,如图2; c.Location属性 让控件显示在合适的位置(22, 86),如图3; d.ResourceID属性 设置按钮图标名称,将该属性设置为“Sc1”,如图4;...e.Size属性 设置控件的宽度和高度,将该属性设置为(53, 21),如图5; 图1 图2 图3 图4 图5 e.ImageButton的Click事件 VB: Private Sub

    1.2K20
    领券