学习uni-app的错误以及解决方案

学习uni-app的错误以及解决方案

1.基本介绍

1.pages文件夹下存放的都是页面，新建的vue文件需要在pages.json里注册

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-iKki8SOx-1586582173993)(D:\xiaoyu\小于笔记\ass\pages.PNG)]

2.static里不止可以存放图片，也可存放全局使用的js文件

3.main.js存放公共的js，可以将staic里存放的js文件引入main.js中，需要设置 Vue.prototype. 属性使utils.js 成为全局js

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-S2WH5Fvh-1586582173994)(D:\xiaoyu\小于笔记\ass\mainjs.PNG)]

4.manifest.json是进行配置的

5.一个基本的 vue文件有三个同级父节点

6。如果要应用uni的组件 需要在

import {uniBadge} from '@dcloudio/uni-ui'

2.应用错误和解决办法

1.没有运行环境和npm–》安装nodejs，node.js自带npm

2.跳页 ：

方法一：可以用navigator实现（一定要写open-type=“navigate”，否则navigator组件会不好使）

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-yWKSiPlx-1586582173994)(D:\xiaoyu\小于笔记\ass\跳页组件.PNG)]

方法二：也可以将事件挂在按钮上写一个方法利用navigateTo实现跳页

  提交

 methods: {
	pagekip:function(e){
			// uni.navigateTo({
			//     url: '../index/index?id=1&name=uniapp'
			// });
			}
			}

3.页面间传参问题

方法一：利用navigateTo 在url传输时一起将参数传输 “地址？（？间隔地址和参数）键=值&（参数之间用&间隔）键=值”

方法二：解决input传参问题

一些公共数据需要在utils.js里写一个变量用来接值

var formdata = {};

export default{
	//其他文件调用的名字：方法名（不用加小括号）或属性变量名
	formdata:formdata
}

在login.vue的script里写

methods: {
            formSubmit: function(e) {
                console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
                var formdata = e.detail.value;
				this.utils.formdata = formdata;
                }
        } 

需要接值的index.vue页面里写

onLoad(p) {
			//挂接事件
			console.log(this.utils.formdata)
			//解决方法一的传值问题
			console.log(p.id);
			console.log(p.name);

​
},

4.showModal组件无效

由于把跳页事件挂在提交按键上了，所以先跳页了–》showModal有原生的属性回调

uni.showModal({
                    content: '表单数据内容：' + JSON.stringify(formdata),
                    showCancel: false,
					 success: function (res) {
					        if (res.confirm) {
					            console.log('用户点击确定');
								uni.navigateTo({
								    url: '../index/index?id=1&name=uniapp'
								});
					        } else if (res.cancel) {
					            console.log('用户点击取消');
					        }
					    }
                });

5.关于提交和重写的写法

),
showCancel: false

        },
        formReset: function(e) {
            console.log('清空数据')
        }
        }

```