环境开发完毕,那么就要来写一个小程序来看一看weex怎么写页面了,可以选择的IDE比较多,我选择的是微软的 visual studio code
可以看到 这里 weex 的vue 使用的是相当标准的vue 语法,以及vue的mvvm框架
那么我们就实现一个 小小的 1-100 的list展示
<template>
<div
class= "wrapper" >
<list>
<cell
v- for = "num
in lists" >
<text
class= "text" >这是第{{num}}条数据</text>
</cell>
</list>
</div>
</template>
<style>
.wrapper
{ }
.text
{
font-size:
35px;
text-align:
center;
color: #41B883;
}
</style>
<script>
export default {
data:
{
lists:[]
},
created(){
for ( var i=0;i<100;i++){
this .lists.push(i+1+ '' )
}
}
}
</script>
|
简单的列表就实现了