ivew url 的输入
1.
<FormItem label="链接" prop="url">
<Input v-model="formValidate.url">
<Select v-model="select1" slot="prepend" style="width: 80px">
<Option value="http://">http://</Option>
<Option value="https://">https://</Option>
</Select>
<Select v-model="select2" slot="append" style="width: 70px">
<Option value=".com">.com</Option>
<Option value=".org">.org</Option>
</Select>
</Input>
</FormItem>
2.
select1: "",
select2: "",
formValidate: {
bannerTitle: "",
bannerText: "",
bannerType: "",
images: "",
remarks: "",
startDate: "",
url: "",
status:""
},
3.调接口返回数据
getBanner() {
detailBanner(this.$route.params.bannerCode)
.then(res => {
this.formValidate.bannerCode = res.data.data.bannerCode;
this.formValidate.bannerTitle = res.data.data.bannerTitle;
this.formValidate.bannerText = res.data.data.bannerText;
this.url = res.data.data.url;
let urlHttps = this.url.slice(, ); //https
let urlHttp = this.url.slice(, ); //http
this.select2 = this.url.substr(-); //截取后4位字符串
//进行判断,判断url 的头是http 还是https
if (urlHttps == "https") {
//给左边的选择器赋值
this.select1="https://";
//给中间部分赋值
var length = this.url.length-;
this.formValidate.url=this.url.substr(,length)
}else if (urlHttp == "http") {
//给左边的选择器赋值
this.select1="http://";
var length1 = this.url.length-;
//给中间部分赋值
this.formValidate.url=this.url.substr(,length1);
}
this.formValidate.bannerType = res.data.data.bannerType + "";
this.formValidate.startDate = res.data.data.startDate;
this.value1=res.data.data.startDate;
console.log(this.formValidate.startDate);
this.formValidate.images = res.data.data.images;
let im = res.data.data.images.split(",");
im.map(imss => {
this.uploadList.push({
status: "finished",
response: {
data: {
url: imss
}
}
});
});
})
.catch(error => {
this.$Message.error("请求失败!");
});
},
ivew url 的输入的更多相关文章
- PHP解决搜索时在URL地址栏输入中文字符搜索结果出现乱码
这 个问题的出现的前提是本站代码采用utf-8格式,php空间当页面停留在搜索页面时,在浏览器的地址栏输入中文的关键字进行搜索时会出现乱码,在网上查找资料说 明,是因为浏览器默认将url中的中文字符编 ...
- 简略描述:一个 url 从输入按下回车键,到页面展示出来,都经历了什么?
首先,在输入网址按下回车以后,这个时候DNS服务器会通过当前的网址去解析网址的 ip: 在查找到真的 IP 以后,这个时候浏览器会向 web 服务器发起一个 tcp 连接请求(三次握手): 第一次:建 ...
- 电子邮件和URL输入控件
HTML5还引入了让用户输入邮箱地址和URL的输入控件.那些不支持这类输入控件的浏览器会把他们当成普通文本框来处理. <!DOCTYPE html> <!-- To change t ...
- 输入一个URL到页面呈现其中发生的过程-------http过程详解
在我们点击一个网址,到它能够呈现在浏览器中,展示在我们面前,这个过程中,电脑里,网络上,究竟发生了什么事情. 服务器启动监听模式 那我们就开始了,故事其实并不是从在浏览器的地址栏输入一个网址,或者我们 ...
- 计算机网络【6】—— 从浏览器输入URL到显示页面发生了什么
当在浏览器地址栏输入网址,如:www.baidu.com后浏览器是怎么把最终的页面呈现出来的呢?这个过程可以大致分为两个部分:网络通信和页面渲染. 一.网络通信 互联网内各网络设备间的通信都遵循TCP ...
- 在浏览器输入URL后发生了什么?
摘录部分一:https://www.cnblogs.com/kongxy/p/4615226.html 从输入URL到浏览器显示页面发生了什么 当在浏览器地址栏输入网址,如:www.baidu.com ...
- 在浏览器输入URL发生了什么
在我们输入google.com之后,浏览器上很快就会呈现出谷歌的页面,本文简单介绍一下从URL的输入到浏览器页面的展示,这中间发生了些什么. URL是什么URL全名叫统一资源定位符,uniform r ...
- 一文摸透从输入URL到页面渲染的过程
一文摸透从输入URL到页面渲染的过程 从输入URL到页面渲染需要Chrome浏览器的多个进程配合,所以我们先来谈谈现阶段Chrome浏览器的多进程架构. 一.Chrome架构 目前Chrome采用的是 ...
- 从 输入网址(URL)到页面展示的过程
1.用户输入url网址(URL) 用户输入url(也就是我们说的网址,也是统一资源定义符,用于定义互联网资源) 比如输入https://www.baidu.com 其中https为协议 baidu.c ...
随机推荐
- sql2000如何完美压缩.mdf文件
--收缩数据库 dbcc shrinkdatabase('test_db') , ) --数据文件mdf , ) --日志文件ldf ) --更新
- 使用sys.dm_exec_cached_plans监控存储过程性能
讨论了如何使用sys.dm_exec_query_stats动态管理视图(dmv ).本文将以SQL Server 2005为例,讨论如何利用dmv信息来判断tsql的性能优劣.在这篇文章中将继续我有 ...
- 用树状数组写的最长上升子序列(友好城市),nlogn。
#include<iostream> #include<algorithm> #define maxn 100000 #define lb(x) x&-x using ...
- JavaScript fetch接口
JavaScript fetch接口 如果看网上的fetch教程,会首先对比XMLHttpRequest和fetch的优劣,然后引出一堆看了很快会忘记的内容(本人记性不好).因此,我写一篇关于fetc ...
- ubuntu python3相关
安装pip3 sudo apt install python3-pipsudo apt-get install python3-virtualenv sudo pip3 install virtual ...
- potplayer录制视频包含字幕
用potplayer录制视频,只能保存视频,外挂字幕的视频字幕无法录制进去 在字幕设置里将几个选项更改,即 字幕输出方式改为直接, 渲染方式不要选矢量即可. 如图:
- 页面跳转(包括vue路由)
1.JS实现页面跳转 1.1 使用window.location的href属性跳转 window.location.href = 'http://www.baidu.com';此处window可以省略 ...
- 关于C++ string 的神奇用法
c++里有大部分字符的操作都在#include<cstring>这个库中,这个库的函数在考试的时候都是可以用的,这个库里包含了很多字符串操作函数,特别是string这个数据类型特别优美,它 ...
- 生日蛋糕(dfs+剪枝)
生日蛋糕 POJ - 1190 题目: 7月17日是Mr.W的生日,ACM-THU为此要制作一个体积为Nπ的M层生日蛋糕,每层都是一个圆柱体. 设从下往上数第i(1 <= i <= M) ...
- 两台centos,用yum install 安装,一台成功,一台失败
记录一下问题: 两台centos,用yum install 安装软件,一台成功,一台失败 第一步:查看yum源 yum repolist enabled 疑问:centos安装的方法一致,但yum源 ...