标签:nta load initial cti xib 之间 one 程序 nload
MVC模式
1. model:模型层,数据的增删改查
2. view:视图层,前端页面
3. controller:控制层,处理业务
文件页面结构
1. 页面以`.vue`结尾
2. `template`,`script`,`style`三个标签,一个页面只能存在一个
3. 代码段分析如下所示:
<script> //vm(view-model):协调者调度器 export default { // model 所有的数据 data() { return { title: ‘Hello‘ } }, onLoad() { }, // 所有自定义的方法函数都写在这里 methods: { } } </script>
v-if与v-show的区别
前者在DOM中被移除,后者display:none
在不同端进行编译
<template> <view> <!-- #ifdef H5 --> <view>只在H5编译</view> <!-- #endif --> <!-- #ifdef APP-PLUS --> <view>只在ios/安卓编译</view> <!-- #endif --> <!-- #ifdef MP --> <view>只在小程序编译</view> <!-- #endif --> <!-- #ifdef MP-WEIXIN --> <view>只在微信小程序编译</view> <!-- #endif --> <!-- #ifndef MP --> <view>不在小程序编译</view> <!-- #endif --> <view class="color"></view> </view> </template> <script> export default { data() { return { } }, onLoad(){ // #ifdef H5 console.log("只在H5编译"); // #endif // #ifdef APP-PLUS console.log("只在ios/安卓编译"); // #endif // #ifdef MP console.log("只在小程序编译"); // #endif // #ifdef MP-WEIXIN console.log("只在微信小程序编译"); // #endif }, methods: { } } </script> <style> .color{ /* #ifdef H5 */ background-color: #008000; /* #endif */ /* #ifdef MP-WEIXIN */ background-color: #007AFF; /* #endif */ width: 250upx; height: 250upx; } </style>
flex布局
1. flexible box:弹性盒状布局
2. 容器控制内部元素的布局定位
3. 伸缩元素,自由填充,自适应
布局优势
- 可在不同方向排列元素
- 控制元素排序的方向
- 控制元素的对齐方式
- 控制元素之间的差距
- 控制单个元素放大与缩放比例、占比、对齐方式
flex布局常用术语
1. flex contaier:flex容器
2. flex item: flex项目(元素)
3. flex direction: 布局方向
flex容器的属性
1. flex-direction:设置元素的排列方向
标签:nta load initial cti xib 之间 one 程序 nload
原文地址:https://www.cnblogs.com/leoych/p/14893131.html