原声html中怎么加载vue文件,HTML文件引入Vue开发

HTML文件引入Vue开发

页面标题

{{text}}

{{item.text}}

点击事件 @click

{{text}}

添加文本使用两个大括号｛｛文本｝｝

img标签中src前面得加冒号

new Vue({

el: "#Vue",

data: {

text: "hallo,word",

img: "",

arr: []

},

methods: {

click() {

console.log(1111)

}

},

created() {

let that = this

$.ajax({

type: "get",//请求方式

async: false,

url: "__CONTROLLER__/gettesttos",

data: {},//传值给后台

dataType: "json",

success: function (res) {

console.log(res.info.data)

that.text = res.info.text

that.img = res.info.img

that.arr = res.info.data

},

});

}

})

data中定义需要使用的数据

data: {

text: "hallo,word",

img: "",

arr: []

},

在methods中写入点击事件

methods: {

click() {

console.log(1111)

}

},

请求接口后进行渲染

created() {

let that = this //定义一个that

$.ajax({

type: "get",//请求方式

async: false,

url: "__CONTROLLER__/gettesttos",

data: {},//传值给后台

dataType: "json",

success: function (res) {

console.log(res.info.data)

that.text = res.info.text

that.img = res.info.img

that.arr = res.info.data

},

});

}

for循环渲染要用v-for

item是自己定义的值

{{item.text}}

arr是需要循环的数组名字