欢迎光临，了解微信小程序开发，就上易用通！

当前位置： 易用通 > 开发文档 > 教程

问答小程序开发《二》：提问页UI设计及前端代码编写

发布：2017-12-09 16:58浏览： 次来源：网络 作者：tianshu

微信小程序开发者社区（www.mntuku.cn）为您提供：问答小程序开发《二》：提问页UI设计及前端代码编写
相关的资讯，希望对您有帮助。
 

问答小程序开发《二》：提问页UI设计及前端代码编写

js部分似乎代码不全，所以本文仅供参考来自原文地址UI图：为方便用户使用，提问页即为首页。提问页有问题输入框、问题描述输入框、图片上传、提交/重置表单元素。index.wxss代码：/**index.wxss**/page{ background- ...

 
 
 
js部分似乎代码不全，所以本文仅供参考


UI图：

问答小程序开发《二》：提问页UI设计及前端代码编写(图1)

为方便用户使用，提问页即为首页。提问页有问题输入框、问题描述输入框、图片上传、提交/重置表单元素。

index.wxss代码：

 

			
    
				
  1. 
					/**index.wxss**/
    2. 
				
  2. 
					page{
    3. 
				
  3. 
					background-color: #efeff4;
    4. 
				
  4. 
					}
    5. 
				
  5. 
					.container{
    6. 
				
  6. 
					padding:0px;
    7. 
				
  7. 
					}
    8. 
				
  8. 
					.container .tip{
    9. 
				
  9. 
					width: 100%;
    10. 
				
  10. 
					background-color: #FFFFFF;
    11. 
				
  11. 
					margin-bottom: 10px;
    12. 
				
  12. 
					}
    13. 
				
  13. 
					.container .tip text{
    14. 
				
  14. 
					display:block;
    15. 
				
  15. 
					padding: 10px;
    16. 
				
  16. 
					text-align: center;
    17. 
				
  17. 
					font-size: 14px;
    18. 
				
  18. 
					line-height: 30px;
    19. 
				
  19. 
					}
    20. 
				
  20. 
					.container .form{
    21. 
				
  21. 
					width: 100%;
    22. 
				
  22. 
					height:100%;
    23. 
				
  23. 
					background-color: #FFFFFF;
    24. 
				
  24. 
					}
    25. 
				
  25. 
					.container .form form{
    26. 
				
  26. 
					height:100%;
    27. 
				
  27. 
					display: block;
    28. 
				
  28. 
					padding: 10px;
    29. 
				
  29. 
					text-align: center;
    30. 
				
  30. 
					}
    31. 
				
  31. 
					.container .form form .section{
    32. 
				
  32. 
					text-align: left;
    33. 
				
  33. 
					margin: 10px 0px;
    34. 
				
  34. 
					}
    35. 
				
  35. 
					.section.upload{
    36. 
				
  36. 
					margin: 20px 0px!important;
    37. 
				
  37. 
					}
    38. 
				
  38. 
					.img-upload{
    39. 
				
  39. 
					height: 100%;
    40. 
				
  40. 
					width: 100%;
    41. 
				
  41. 
					position: relative;
    42. 
				
  42. 
					}
    43. 
				
  43. 
					.img-upload .img-icon-box{
    44. 
				
  44. 
					display: inline-block;
    45. 
				
  45. 
					margin:0px 20px 15px 0px;
    46. 
				
  46. 
					}
    47. 
				
  47. 
					.img-upload icon{
    48. 
				
  48. 
					position: absolute;
    49. 
				
  49. 
					margin: -15px 0px auto 80px;
    50. 
				
  50. 
					}
    51. 
				
  51. 
					.img-upload .img-box{
    52. 
				
  52. 
					border: 1px #eee solid;
    53. 
				
  53. 
					}
    54. 
				
  54. 
					.img-upload image{
    55. 
				
  55. 
					width: 80px;
    56. 
				
  56. 
					height: 80px;
    57. 
				
  57. 
					}
    58. 
				
  58. 
					input{
    59. 
				
  59. 
					width: 95%;
    60. 
				
  60. 
					border-radius: 5px;
    61. 
				
  61. 
					border: 1px #eee solid;
    62. 
				
  62. 
					font-size: 14px;
    63. 
				
  63. 
					padding: 2%;
    64. 
				
  64. 
					}
    65. 
				
  65. 
					textarea{
    66. 
				
  66. 
					width: 95%;
    67. 
				
  67. 
					border-radius: 5px;
    68. 
				
  68. 
					border: 1px #eee solid;
    69. 
				
  69. 
					height: 100px;
    70. 
				
  70. 
					font-size: 14px;
    71. 
				
  71. 
					padding: 2%;
    72. 
				
  72. 
					}
    73. 
				
  73. 
					.container .form form .btns{
    74. 
				
  74. 
					width: 100%;
    75. 
				
  75. 
					}
    76. 
				
  76. 
					/*版权*/
    77. 
				
  77. 
					.copyright{
    78. 
				
  78. 
					height:40px;
    79. 
				
  79. 
					line-height: 40px;
    80. 
				
  80. 
					color:#8f8f94;
    81. 
				
  81. 
					font-size:12px;
    82. 
				
  82. 
					float: left; 
    83. 
				
  83. 
					bottom: 20px;
    84. 
				
  84. 
					}
    85. 
				
  85. 
					/*字体图标*/
    86. 
				
  86. 
					@font-face {
    87. 
				
  87. 
					font-family: iconfont;
    88. 
				
  88. 
					/*字体base64 https://transfonter.org/*/
    89. 
				
  89. 
					src: url(data:font/truetype;charset=utf-8;base64,AAEAAAAQAQAABAAARkZUTX4kzbEAABSsAAAAHEdERUYAJwALAAAUjAAAAB5PUy8yVyRY7wAAAYgAAABWY21hcACN7OMAAAH0AAABUmN2dCANFf9EAAANeAAAACRmcGdtMPeelQAAA0gAAAmWZ2FzcAAAABAAABSEAAAACGdseWYrrMSWAAANqAAABGBoZWFkDUF4hwAAAQwAAAA2aGhlYQeYA64AAAFEAAAAJGhtdHgNPgBeAAAB4AAAABRsb2NhATwCMAAADZwAAAAMbWF4cAFEAhAAAAFoAAAAIG5hbWUlSrxQAAASCAAAAj1wb3N0UiVELwAAFEgAAAA6cHJlcKW5vmYAAAzgAAAAlQABAAAAAQAAc1g5k18PPPUAHwQAAAAAANUAGkUAAAAA1QAaRQAs/6gD4gNYAAAACAACAAAAAAAAAAEAAANY/6gAXAQAAAAAAAPiAAEAAAAAAAAAAAAAAAAAAAAFAAEAAAAFAGEABQAAAAAAAgAoADYAbAAAAKUBdwAAAAAAAQP0AfQABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAIABgMAAAAAAAAAAAABEAAAAAAAAAAAAAAAUGZFZABAAHjmEAOA/4AAXANYAFgAAAABAAAAAAAABAAAAAAAAAABVQAAA+kALAQAADIAAAADAAAAAwAAABwAAQAAAAAATAADAAEAAAAcAAQAMAAAAAgACAACAAAAAAB45hD//wAAAAAAeOYQ//8AAP+LGfQAAQAAAAAAAAAAAAABBgAAAQAAAAAAAAABAgAAAAIAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAsAAssCBgZi2wASwgZCCwwFCwBCZasARFW1ghIyEbilggsFBQWCGwQFkbILA4UFghsDhZWSCwCkVhZLAoUFghsApFILAwUFghsDBZGyCwwFBYIGYgiophILAKUFhgGyCwIFBYIbAKYBsgsDZQWCGwNmAbYFlZWRuwACtZWSOwAFBYZVlZLbACLCBFILAEJWFkILAFQ1BYsAUjQrAGI0IbISFZsAFgLbADLCMhIyEgZLEFYkIgsAYjQrIKAAIqISCwBkMgiiCKsAArsTAFJYpRWGBQG2FSWVgjWSEgsEBTWLAAKxshsEBZI7AAUFhlWS2wBCywCCNCsAcjQrAAI0KwAEOwB0NRWLAIQyuyAAEAQ2BCsBZlHFktsAUssABDIEUgsAJFY7ABRWJgRC2wBiywAEMgRSCwACsjsQQEJWAgRYojYSBkILAgUFghsAAbsDBQWLAgG7BAWVkjsABQWGVZsAMlI2FERC2wByyxBQVFsAFhRC2wCCywAWAgILAKQ0qwAFBYILAKI0JZsAtDSrAAUlggsAsjQlktsAksILgEAGIguAQAY4ojYbAMQ2AgimAgsAwjQiMtsAosS1RYsQcBRFkksA1lI3gtsAssS1FYS1NYsQcBRFkbIVkksBNlI3gtsAwssQANQ1VYsQ0NQ7ABYUKwCStZsABDsAIlQrIAAQBDYEKxCgIlQrELAiVCsAEWIyCwAyVQWLAAQ7AEJUKKiiCKI2GwCCohI7ABYSCKI2GwCCohG7AAQ7ACJUKwAiVhsAgqIVmwCkNHsAtDR2CwgGIgsAJFY7ABRWJgsQAAEyNEsAFDsAA+sgEBAUNgQi2wDSyxAAVFVFgAsA0jQiBgsAFhtQ4OAQAMAEJCimCxDAQrsGsrGyJZLbAOLLEADSstsA8ssQENKy2wECyxAg0rLbARLLEDDSstsBIssQQNKy2wEyyxBQ0rLbAULLEGDSstsBUssQcNKy2wFiyxCA0rLbAXLLEJDSstsBgssAcrsQAFRVRYALANI0IgYLABYbUODgEADABCQopgsQwEK7BrKxsiWS2wGSyxABgrLbAaLLEBGCstsBsssQIYKy2wHCyxAxgrLbAdLLEEGCstsB4ssQUYKy2wHyyxBhgrLbAgLLEHGCstsCEssQgYKy2wIiyxCRgrLbAjLCBgsA5gIEMjsAFgQ7ACJbACJVFYIyA8sAFgI7ASZRwbISFZLbAkLLAjK7AjKi2wJSwgIEcgILACRWOwAUViYCNhOCMgilVYIEcgILACRWOwAUViYCNhOBshWS2wJiyxAAVFVFgAsAEWsCUqsAEVMBsiWS2wJyywByuxAAVFVFgAsAEWsCUqsAEVMBsiWS2wKCwgNbABYC2wKSwAsANFY7ABRWKwACuwAkVjsAFFYrAAK7AAFrQAAAAAAEQ+IzixKAEVKi2wKiwgPCBHILACRWOwAUViYLAAQ2E4LbArLC4XPC2wLCwgPCBHILACRWOwAUViYLAAQ2GwAUNjOC2wLSyxAgAWJSAuIEewACNCsAIlSYqKRyNHI2EgWGIbIVmwASNCsiwBARUUKi2wLiywABawBCWwBCVHI0cjYbAGRStlii4jICA8ijgtsC8ssAAWsAQlsAQlIC5HI0cjYSCwBCNCsAZFKyCwYFBYILBAUVizAiADIBuzAiYDGllCQiMgsAlDIIojRyNHI2EjRmCwBEOwgGJgILAAKyCKimEgsAJDYGQjsANDYWRQWLACQ2EbsANDYFmwAyWwgGJhIyAgsAQmI0ZhOBsjsAlDRrACJbAJQ0cjRyNhYCCwBEOwgGJgIyCwACsjsARDYLAAK7AFJWGwBSWwgGKwBCZhILAEJWBkI7ADJWBkUFghGyMhWSMgILAEJiNGYThZLbAwLLAAFiAgILAFJiAuRyNHI2EjPDgtsDEssAAWILAJI0IgICBGI0ewACsjYTgtsDIssAAWsAMlsAIlRyNHI2GwAFRYLiA8IyEbsAIlsAIlRyNHI2EgsAUlsAQlRyNHI2GwBiWwBSVJsAIlYbABRWMjIFhiGyFZY7ABRWJgIy4jICA8ijgjIVktsDMssAAWILAJQyAuRyNHI2EgYLAgYGawgGIjICA8ijgtsDQsIyAuRrACJUZSWCA8WS6xJAEUKy2wNSwjIC5GsAIlRlBYIDxZLrEkARQrLbA2LCMgLkawAiVGUlggPFkjIC5GsAIlRlBYIDxZLrEkARQrLbA3LLAuKyMgLkawAiVGUlggPFkusSQBFCstsDgssC8riiAgPLAEI0KKOCMgLkawAiVGUlggPFkusSQBFCuwBEMusCQrLbA5LLAAFrAEJbAEJiAuRyNHI2GwBkUrIyA8IC4jOLEkARQrLbA6LLEJBCVCsAAWsAQlsAQlIC5HI0cjYSCwBCNCsAZFKyCwYFBYILBAUVizAiADIBuzAiYDGllCQiMgR7AEQ7CAYmAgsAArIIqKYSCwAkNgZCOwA0NhZFBYsAJDYRuwA0NgWbADJbCAYmGwAiVGYTgjIDwjOBshICBGI0ewACsjYTghWbEkARQrLbA7LLAuKy6xJAEUKy2wPCywLyshIyAgPLAEI0IjOLEkARQrsARDLrAkKy2wPSywABUgR7AAI0KyAAEBFRQTLrAqKi2wPiywABUgR7AAI0KyAAEBFRQTLrAqKi2wPyyxAAEUE7ArKi2wQCywLSotsEEssAAWRSMgLiBGiiNhOLEkARQrLbBCLLAJI0KwQSstsEMssgAAOistsEQssgABOistsEUssgEAOistsEYssgEBOistsEcssgAAOystsEgssgABOystsEkssgEAOystsEossgEBOystsEsssgAANystsEwssgABNystsE0ssgEANystsE4ssgEBNystsE8ssgAAOSstsFAssgABOSstsFEssgEAOSstsFIssgEBOSstsFMssgAAPCstsFQssgABPCstsFUssgEAPCstsFYssgEBPCstsFcssgAAOCstsFgssgABOCstsFkssgEAOCstsFossgEBOCstsFsssDArLrEkARQrLbBcLLAwK7A0Ky2wXSywMCuwNSstsF4ssAAWsDArsDYrLbBfLLAxKy6xJAEUKy2wYCywMSuwNCstsGEssDErsDUrLbBiLLAxK7A2Ky2wYyywMisusSQBFCstsGQssDIrsDQrLbBlLLAyK7A1Ky2wZiywMiuwNistsGcssDMrLrEkARQrLbBoLLAzK7A0Ky2waSywMyuwNSstsGossDMrsDYrLbBrLCuwCGWwAyRQeLABFTAtAABLuADIUlixAQGOWbkIAAgAYyCwASNEILADI3CwDkUgIEu4AA5RS7AGU1pYsDQbsChZYGYgilVYsAIlYbABRWMjYrACI0SzCgkFBCuzCgsFBCuzDg8FBCtZsgQoCUVSRLMKDQYEK7EGAUSxJAGIUViwQIhYsQYDRLEmAYhRWLgEAIhYsQYBRFlZWVm4Af+FsASNsQUARAAAAAAAAAAAAAAAAAAAAAAAAAAAMgAyAxj/4QNY/6gDGP/hA1j/qAAAAAAAAAAAATwCMAAFACz/4QO8AxgAFgAwADoAUgBeAXdLsBNQWEBKAgEADQ4NAA5mAAMOAQ4DXgABCAgBXBABCQgKBgleEQEMBgQGDF4ACwQLaQ8BCAAGDAgGWAAKBwUCBAsKBFkSAQ4ODVEADQ0KDkIb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) format(truetype);
    90. 
				
  90. 
					 
    91. 
				
  91. 
					}
    92. 
				
  92. 
					 
    93. 
				
  93. 
					.iconfont {
    94. 
				
  94. 
					font-family:iconfont !important;
    95. 
				
  95. 
					font-size:16px;
    96. 
				
  96. 
					font-style:normal;
    97. 
				
  97. 
					-webkit-font-smoothing: antialiased;
    98. 
				
  98. 
					-webkit-text-stroke-width: 0.2px;
    99. 
				
  99. 
					}
    100. 
				
  100. 
					.icon-zengjia:before { content: e64e; }
    101. 
			

			

				index.js代码：

			

				 

			

			
    
				
  1. 
					var app = getApp();//初始化实例
    2. 
				
  2. 
					var functions = require(../../function.js);//引入公共函数库
    3. 
				
  3. 
					var Promise = require(../../es6-promise.min.js);//引入ES6
    4. 
				
  4. 
					var imgUrls=Array();
    5. 
				
  5. 
					Page({
    6. 
				
  6. 
					//初始化数据
    7. 
				
  7. 
					data: {
    8. 
				
  8. 
					},
    9. 
				
  9. 
					onLoad: function () {
    10. 
				
  10. 
					var that = this;
    11. 
				
  11. 
					//更新用户信息
    12. 
				
  12. 
					var getUserInfo = function(){
    13. 
				
  13. 
					return new Promise(function(resolve,reject){
    14. 
				
  14. 
					app.getUserInfo();
    15. 
				
  15. 
					resolve();
    16. 
				
  16. 
					});
    17. 
				
  17. 
					};
    18. 
				
  18. 
					getUserInfo().then(function(){
    19. 
				
  19. 
					 
    20. 
				
  20. 
					});
    21. 
				
  21. 
					},
    22. 
				
  22. 
					//分享
    23. 
				
  23. 
					onShareAppMessage: function () {
    24. 
				
  24. 
					return {
    25. 
				
  25. 
					title: 搜问网,
    26. 
				
  26. 
					desc: 一键提交问题，坐等答案自动推送到您的微信上。,
    27. 
				
  27. 
					path: pages/index/index
    28. 
				
  28. 
					}
    29. 
				
  29. 
					},
    30. 
				
  30. 
					//下拉刷新
    31. 
				
  31. 
					onPullDownRefresh: function(){
    32. 
				
  32. 
					 
    33. 
				
  33. 
					wx.stopPullDownRefresh();
    34. 
				
  34. 
					},
    35. 
				
  35. 
					//选择图片
    36. 
				
  36. 
					chooseImage:function(){
    37. 
				
  37. 
					var that=this;
    38. 
				
  38. 
					wx.chooseImage({
    39. 
				
  39. 
					count: 1,
    40. 
				
  40. 
					sizeType: [compressed],
    41. 
				
  41. 
					success: function(res){
    42. 
				
  42. 
					var tempFilePaths = res.tempFilePaths;
    43. 
				
  43. 
					console.log(tempFilePaths);
    44. 
				
  44. 
					wx.uploadFile({
    45. 
				
  45. 
					url: https://www.soswen.com/weixin/Question/upload, //仅为示例，非真实的接口地址
    46. 
				
  46. 
					filePath: tempFilePaths[0],
    47. 
				
  47. 
					name: file,
    48. 
				
  48. 
					header: {
    49. 
				
  49. 
					content-type: multipart/form-data
    50. 
				
  50. 
					},
    51. 
				
  51. 
					success: function(res){
    52. 
				
  52. 
					var data = JSON.parse(res.data);
    53. 
				
  53. 
					if(data.status){
    54. 
				
  54. 
					console.log(data.data);
    55. 
				
  55. 
					imgUrls.push(data.data);
    56. 
				
  56. 
					that.setData({
    57. 
				
  57. 
					imgUrls:imgUrls
    58. 
				
  58. 
					});
    59. 
				
  59. 
					console.log(imgUrls);
    60. 
				
  60. 
					}else{
    61. 
				
  61. 
					console.log(res);
    62. 
				
  62. 
					}
    63. 
				
  63. 
					},
    64. 
				
  64. 
					fail:function(res){
    65. 
				
  65. 
					console.log(res);
    66. 
				
  66. 
					}
    67. 
				
  67. 
					});
    68. 
				
  68. 
					}
    69. 
				
  69. 
					});
    70. 
				
  70. 
					},
    71. 
				
  71. 
					//预览图片
    72. 
				
  72. 
					previewImage:function(e){
    73. 
				
  73. 
					wx.previewImage({
    74. 
				
  74. 
					current:e.currentTarget.dataset.src,
    75. 
				
  75. 
					urls: imgUrls
    76. 
				
  76. 
					});
    77. 
				
  77. 
					},
    78. 
				
  78. 
					//删除图片
    79. 
				
  79. 
					delImage:function(e){
    80. 
				
  80. 
					console.log(e.currentTarget.dataset.key);
    81. 
				
  81. 
					var tempimgUrls=Array();
    82. 
				
  82. 
					for(var i=0;i
    83. 
			

		

	





 

          

          

          

        

        

          
          
        

        

        

          
免责声明：本站所有文章和图片均来自用户分享和网络收集，文章和图片版权归原作者及原出处所有，仅供学习与参考，请勿用于商业用途，如果损害了您的权利，请联系网站客服处理。

        

      

      

      
 相关文章
        
      

    

    

      
 最新文章
        
      

      
 推荐文章
        
      

      
 随机文章
        
      

      
 热门小程序
        

          
        

      

    

  

   
  
 开发文档  | 运营教程 小程序模板  | 小程序应用   | 标签大全 

  Copyright © 2017 https://www.yiyongtong.com 易用通 版权所有