VUE.js 简单引用
Vue开发的两种方式:静态资源引入开发 和 脚手架交互式开发
这里使用的是静态资源引入开发
首先 引用jquery.js 和 vue.js
html 标签内加个
<div id="box">内容</div>
<script>
var vm = new Vue({
el: '#box',
data: {
lists: [],
adverts: [],
page: "",
airdropLists: [],
airdropId: ''
},
created: function () {
var that = this
that.token = localStorage.getItem('token')
console.log(that.token)
that.post()
that.getList()
},
mounted() { // 通知公告
var swiper = new Swiper('.swiper-notice', {
direction: 'vertical',
autoplay: {
delay: ,
disableOnInteraction: false,
},
observer: true,//修改swiper自己或子元素时,自动初始化swiper
observeParents: true//修改swiper的父元素时,自动初始化swiper
});
},
methods: {
post: function () {
var that = this;
$.ajax({
type: "POST", //提交方式
url: URL + "index.php/Api/Member/advert", //广告
dataType: 'json',
data: {},
success: function (res) { //返回数据根据结果进行相应的处理
console.log(res.data.advert)
if (res.code == ) {
that.adverts = res.data.advert
}
}
})
},
// 获取订单列表
getList: function () {
var that = this
$.ajax({
type: "POST", //提交方式
url: URL + "/index.php/Api/Airdrop/airdrop_list", //空投列表
dataType: 'json',
data: {
// token: that.token,
page:
},
success: function (res) { //返回数据根据结果进行相应的处理
console.log(res)
if (res.code == ) {
that.airdropLists = res.data
}
}
})
},
login: function (airdrop_id) {
var that = this
console.log(airdrop_id)
that.airdrop_id = airdrop_id
console.log()
if (that.token == null) {
window.location.href = "loginRegister.html";
}
else {
window.location.href = "airdropDetails.html?airdrop_id=" + airdrop_id;
}
},
logined: function () {
var that = this
if (that.token == null) {
window.location.href = "loginRegister.html";
}
},
},
}); </script>
VUE.js 简单引用的更多相关文章
- 98、vue.js简单入门
本篇导航: 介绍与安装 vue常用指令 一.介绍与安装 vue是一套构建用户界面的JAVASCRIPT框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层, ...
- 13、vue.js简单入门
本篇导航: 介绍与安装 vue常用指令 一.介绍与安装 vue是一套构建用户界面的JAVASCRIPT框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层, ...
- Vue.js简单的应用
1:一个简单实现 下面代码部分: <body> <div id="myDiv1"> {{userName}} </div> </body& ...
- vue.js简单添加和删除
这只是个简单的添加和删除,没有连接后台数据的 <%@ page language="java" contentType="text/html; charset=UT ...
- vue.js 组件引用之初级 之二
1. template 标签也可以实现替换,这样可以省去script标签了 <!DOCTYPE html> <html lang="en"> <hea ...
- vue.js 组件引用之初级
1. 构造组件,及组件引用:1.1 构造一个组件,1.2 注册一个组件,1.3 实例化Vue()即引用Vue() <!DOCTYPE html> <html lang=" ...
- Vue.js简单入门
这篇文章我们将学习vue.js的基础语法,对于大家学习vue.js具有一定的参考借鉴价值,有需要的朋友们下面来一起看看. Vue.js是一个数据驱动的web界面库.Vue.js只聚焦于视图层,可以很容 ...
- Vue.js简单记录
官网:https://cn.vuejs.org/ https://cn.vuejs.org/v2/api/#methods v-bind 缩写 <!-- 完整语法 --> <a v- ...
- Vue.js简单实践
直接上代码,一个简单的新闻列表页面(.cshtml): @section CssSection{ <style> [v-cloak] { display: none; } </sty ...
随机推荐
- [qemu][kvm] 在kvm嵌套kvm的虚拟机里启动kvm加速
常规情况下,如果在kvm的虚拟机里,又想使用kvm的虚拟机,会报如下的错误信息: [root@host0 nlb]# Could not access KVM kernel module: No su ...
- post方式接口测试(一)_新建测试用例
第一种方式:拷贝别人的 第二种方式:自己创建 二.打开浏览器(此处chrome),F12打开开发模式,输入网址登录,此时可获取到登录的 Request URL 二.打开postman,进入自己的Col ...
- 执行git add .命令时报warning: LF will be replaced by CRLF in yarn.lock.
解决办法是执行:git config --global core.autocrlf false 是符号 / 转义的问题
- Vue脚手架使用步骤 2.9.6版本
转载自:https://blog.csdn.net/sky_LQ/article/details/80729547 Vue脚手架使用步骤 2018年06月19日 12:10:35 sky_LQ 阅读数 ...
- SpringMVC控制器方法参数传入的ModelMap 和Model类型有啥区别
参考 http://blog.csdn.net/u013067598/article/details/69372309 http://blog.csdn.net/u013686993/article/ ...
- Docker 推送镜像到hub.docker
1.Docker镜像文件:lails.server.demo:1.0, 2.登录Docker:docker login[根据提示输入用户名/密码] 3.执行:docker push lails.ser ...
- select2 api参数中文文档
select2 api参数的文档 具体参数可以参考一下: 参数 类型 描述 Width 字符串 控制 宽度 样式属性的Select2容器div minimumInputLength int 最小数 ...
- CentOS 7 搭建CA认证中心实现https取证
CA认证中心简述 CA :CertificateAuthority的缩写,通常翻译成认证权威或者认证中心,主要用途是为用户发放数字证书 功能:证书发放.证书更新.证书撤销和证书验证. 作用:身份认证, ...
- Tomcat增加Context配置不带项目名访问导致启动的时候项目加载两次
eclipse发布web应用至tomcat,默认方式下访问该项目是需要带项目名称的,例http://localhost:8080/myapp/.现在需要改成这样访问http://localhost.修 ...
- 【Spark-core学习之二】 RDD和算子
环境 虚拟机:VMware 10 Linux版本:CentOS-6.5-x86_64 客户端:Xshell4 FTP:Xftp4 jdk1.8 scala-2.10.4(依赖jdk1.8) spark ...