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 简单引用的更多相关文章

  1. 98、vue.js简单入门

    本篇导航: 介绍与安装 vue常用指令 一.介绍与安装 vue是一套构建用户界面的JAVASCRIPT框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层, ...

  2. 13、vue.js简单入门

    本篇导航: 介绍与安装 vue常用指令 一.介绍与安装 vue是一套构建用户界面的JAVASCRIPT框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层, ...

  3. Vue.js简单的应用

    1:一个简单实现 下面代码部分: <body> <div id="myDiv1"> {{userName}} </div> </body& ...

  4. vue.js简单添加和删除

    这只是个简单的添加和删除,没有连接后台数据的 <%@ page language="java" contentType="text/html; charset=UT ...

  5. vue.js 组件引用之初级 之二

    1. template 标签也可以实现替换,这样可以省去script标签了 <!DOCTYPE html> <html lang="en"> <hea ...

  6. vue.js 组件引用之初级

    1. 构造组件,及组件引用:1.1 构造一个组件,1.2 注册一个组件,1.3  实例化Vue()即引用Vue() <!DOCTYPE html> <html lang=" ...

  7. Vue.js简单入门

    这篇文章我们将学习vue.js的基础语法,对于大家学习vue.js具有一定的参考借鉴价值,有需要的朋友们下面来一起看看. Vue.js是一个数据驱动的web界面库.Vue.js只聚焦于视图层,可以很容 ...

  8. Vue.js简单记录

    官网:https://cn.vuejs.org/ https://cn.vuejs.org/v2/api/#methods v-bind 缩写 <!-- 完整语法 --> <a v- ...

  9. Vue.js简单实践

    直接上代码,一个简单的新闻列表页面(.cshtml): @section CssSection{ <style> [v-cloak] { display: none; } </sty ...

随机推荐

  1. xss脚本绕过限制的方法

    第一关:第一关比较简单,直接写入标签就可以,这里不多说了,payload如下: http://sqler.win/xss/level1.php?name=test%3Csvg/onload=alert ...

  2. Restsharp常见格式的发送分析

    1.传递匿名对象JSON格式 public string Pay(string apisecret, string apikey, string token) { try { string url = ...

  3. python摸爬滚打之day15----初识类

    1.面向对象和面向过程 面向过程: 以事物的流程为核心.  优点: 负责的事物流程化, 编写简单; 缺点: 可拓展性差. 面向对象: 一切以对象为核心. 对象里封装着一切. 优点: 可拓展性强; 缺点 ...

  4. 《Java程序设计》 第五周学习总结

    学号 20175313 <Java程序设计>第五周学习总结 教材学习内容总结 第六章主要内容 掌握接口的定义 接口声明:interface 接口名 接口体:包含常量的声明和抽象方法. 接口 ...

  5. 用热情点燃软件工程II

    这个作业的要求来自于:https://www.cnblogs.com/greyzeng/p/9581624.html 阅读完文章(热情.能力.选择)深有感触.文章链接为:http://coolshel ...

  6. python基础之 编码进阶,文件操作和深浅copy

    1.编码的进阶 字符串在Python内部的表示是unicode编码,因此,在做编码转换时,通常需要以unicode作为中间编码.即先将其他编码的字符串解码(decode)成unicode,再从unic ...

  7. android 前台服务不显示通知

    原因可以在哪里写了执行完成后就自动结束的吧 导致前台服务没有出现 如我 @Override public int onStartCommand(Intent intent, int flags, in ...

  8. VCS

    timing check相关的, +notimingcheck命令,可以用在compile时,也可以用在run time的时候, 都是将检查timing的系统函数,都disable掉了, 加在comp ...

  9. 利用tcp三次握手,使用awl伪装MAC地址进行多线程SYN洪水攻击

    SYN洪水攻击概述:SYN洪水攻击主要源于: tcp协议的三次握手机制tcp协议面向链接的协议SYN洪水攻击的过程:在服务端返回一个确认的SYN-ACK包的时候有个潜在的弊端,如果发起的客户是一个不存 ...

  10. PowerShell 语法备忘

    1.挡可能出现 .0 的时候需要加上引号 2.使用 -Join 或者 + 进行字符串拼接 3.在cmd 命令下可以使用 set /a  s=1+2  表示需要进行计算,而不是拼接