I hope that the front end will receive an array, such as [AMagneBrect C pencil D], which can be displayed at intervals, with a feeling of dynamic loading, instead of refreshing four pieces of data together. Due to the vue response, I have not found a solution for the time being. I wonder if there is any way or whether it can be done through iviewUI?
this can be solved with css animation
http://jsbin.com/lowaxebuve/1.
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
* {
padding: 0;
margin: 0;
}
/* */
.clearfix:after {
content: "";
display: table;
clear: both;
}
html, body {
height: 100%;
}
body {
font-family: "Microsoft YaHei";
background: -sharpE1E1E1;
font-weight: 300;
font-size: 15px;
color: -sharp333;
overflow: hidden;
}
.item{
display: block;
height: 35px;
border: 1px solid -sharp449D44;
margin: 15px;
line-height: 35px;
text-align: center;
}
</style>
</head>
<link href="https://cdn.bootcss.com/animate.css/3.5.2/animate.min.css" rel="stylesheet">
<script src="http://vuejs.org/js/vue.js"></script>
<body>
<div id="app">
<button @click="loaditems">load data</button>
<div v-if="isloaded" class="item animated bounceInDown" v-for="item,index in items" :key="index" :style="{'animation-delay': index * 0.2 + 's'}">{{item.name}}</div>
</div>
</body>
<script>
new Vue({
el:'-sharpapp',
name:"test",
data () {
return {
isloaded: false,
items: []
}
},
methods: {
loaditems(){
setTimeout(()=>{
if(!this.isloaded){
this.items = [
{
name: 'tom'
},
{
name:'jerry'
},
{
name:'lily'
}
]
this.isloaded = true
} else {
this.isloaded = false
this.items = []
}
},300)
}
}
});
</script>
</html>wrote you an example
o ...
the onclick (), that clicks the arrow wants to call oil.prototype.createChart=function (oilRealtable,objId,meteId) {}, Please let me know ...
the px2rem plug-in is used in vue, and then the picture or icon will be blurred when flexbile, adapts to a specific model. How to deal with this situation ...
the data in the score section of ...
on the above plug-in, in order to graphically count, from the big circle, jump to how many small circles, is similar to the timeline plug-in, but this is from one, pointing to multiple branches, the timeline is a back row want to search for a plug...
where can I upload the video, and then take the outer link and put it on the video tag, preferably without advertising? is now uploaded to Qiniu, but the video cache is too slow (because you are using the test domain name), so ask if there are other pla...
var arr = []; arr.toString = = Object.prototype.toString false ...
question: in an h5 mobile page, has such a parent-child relationship: sliding elements up and down = > left and right sliding elements = > Click elements if there are sliding up and down (drop-down refresh), left and right sliding (rotation switch...
these data are all sent from the background STATUS 0 indicates auditing STATUS 1 indicates normal STATUS 2 indicates locked status but now I don t know how to change it to Chinese, how to do it? <tr v-for="(item,index) in infoData&quo...
as shown in the figure, when you jump to a component, the corresponding left navigation turns red. the class that controls highlighting is as follows: .active{ backgournd-color:yellow; } how to achieve it? there is no train of thought at all....
ask for advice on how to achieve this inner shadow effect in svg ...
how does beego work with vue.js ...
handleSave = () => { const syncShow = <svg xmlns="http: www.w3.org 2000 svg" version="1.1" width="100" height="100"> <circle cx="50" cy="50" r="40" stroke="blac...
$.ajax({ url: .. app source addPassenger , data: { passenger_resource: JSON.stringify(passenger_resource), }, dataType: json , type: POST , success: function...
when the WeChat ios drags the input area, the overall page can be dragged, but the page will not slide. If you drag somewhere else, the page will slide, but not in the input area, and there will be no problem on Android phones. The page uses Wechat s we...
as the title: how to achieve the video tag full screen playback and pause display advertising function ...
< select class= "form-control " v muri model = "aaa " > <option v-for="RoleItem in list_roleName" value=RoleItem.id>{{RoleItem.name}}< option> < select > {{aaa}} data are as follows if the user selects BD, the data of...
The online solution used by is Github address: https: github.com hrwhisper ., cloned this locally into the file and introduced it in the code, but reported an error . if (!this.hasBaidu) { this.hasBaidu = true; window....
mock, is used in ant-design-pro. I don t want to use mock, to test my local api server with nodejs. I banned mock in .uplohogrc.mock.js const noProxy = process.env.NO_PROXY === true ; const noProxy = true Save and refresh the web page an...
$( .gopay ).click(function(){ if(jsons!= ){ var index = parent.layer.load(2, {shade:0.3,time: 100*10000}); $.ajax({ type: "get", ...